jquery.autocomplete自动补齐和自定义格式

1.简单的下拉自动补齐,可以使用本地或远程数据源

    <input name="autoTag" id="autoTag" /> 
 var source = ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"];

 $(‘#autoTag‘).autocomplete({source: source});

source也可以指向后台的一个方法:

   $(‘#autoTag‘).autocomplete({
            source: ‘@(Url.Action("AutoCompleteOrderCode"))‘,
            select: function (event, ui) {
              //  getFriendInfo(ui.item.value);
            }
        });
        //自动匹配合同编号
        [HttpGet]
        public ContentResult AutoCompleteOrderCode(string term)
        {
            var service = new ProjectService();
            var cmpOrderList = service.AutoCompleteCmpOrder(UserContext.Current.TenantId,term);
            var content = "[" + string.Join(",", cmpOrderList.Select(q => "\""+ q.CmpSoCode+"\"")) + "]";
            return new ContentResult(){Content = content};
        }

2.自定义数据格式,包括id和text

  <input name="autoTag" id="autoTag" /> <input type="hidden" id="autoTagId" />

  

 var source = [{ value: "1", label: "C++" }, { value: "2", label: "java" }, { value: "3", label: "javascript" }, { value: "4", label: "ruby" }];
$(‘#autoTag‘).autocomplete({
            source: source,
            minLength: 0,
            focus: function (event, ui) {
                $("#autoTag").val(ui.item.label);
                return false;
            },
            select: function (event, ui) {
                $(‘#autoTag‘).val(ui.item.label);
                $(‘#autoTagId‘).val(ui.item.value);
                return false; //必须有这个
            }
        });
时间: 2024-10-08 15:43:33

jquery.autocomplete自动补齐和自定义格式的相关文章

jquery autocomplete 自动补全

写在前面 autocomplete是jqueryUI里的一个插件 效果和说明可以访问这里,作用类似于搜索时的自动提示: 相信用过jQuery autocomplete 自动补全功能同学有不少,但是往往我们所对应的需求不同,有的仅仅是为了省事,敲两个字就有一堆可供选择的信息可供选择,但并不是所有需求都是这样的,我们还有这样的需求,敲两个字,将这个文字对应的实体绑定出来. 主要的参数 jQuery UI Autocomplete常用的参数有: Source:用于指定数据来源,类型为String.Ar

jquery.autocomplete 自动补全 应用

下拉自动补全的js控件还是很多的,不过好多都被集成在N多组件之一了,像Jquery.easyui,jquery.chonsen等等都可以实现类似的功能.但我想要的是是一款简单轻巧,应用于整个系统的js. 于是我选择了jquery.autocomplete.js,基本参数注解参考:http://www.cnblogs.com/EWall/archive/2011/04/28/2031613.html,JS及相关CSS可在google code下载,链接https://code.google.com

jquery.autocomplete自动补全功能

项目实例: 一:js //SupplierAutoComplete.js $().ready(function () { $("#txtSupplier").autocomplete("ajax?name=GetSupplierList", { minChars: 1, //在触发autoComplete前用户至少需要输入的字符数.Default: 1,如果设为0,在输入框内双击或者删除输入框内内容时显示列表 max: 10, //autoComplete下拉显示项

jQuery Autocomplete 自动补全功能

使用Autocomplete可以很简单的就有文本框的自动补全功能提示了. 在HTML文件中引入autocomplete的js文件和css样式文件,以及autocomplete压缩包中的jQuery的js文件,不要私自用高版本的jQuery,可能会导致显示不出效果. 先来从网友那里拷贝过来的最简单的例子: <span style="font-size:24px;"><!DOCTYPE html> <html> <head> <meta

jquery autocomplete自动补全

简单用法: $(function(){ var data = "the People's Republic of China".split(" "); $("#autocomplete").autocomplete(data,{minChars:0}).result(function(event,data,formatted){ alert(data); }); }); </script> <input type="t

关闭浏览器输入框自动补齐 兼容IE,FF,Chrome等主流浏览器

这篇文章主要介绍了关闭浏览器输入框自动补齐 兼容IE,FF,Chrome等主流浏览器,需要的朋友可以参考下.希望对大家有所帮助 Firefox 和 IE 的浏览器各自实现了input历史记录的功能,可以简化输入时的麻烦,但是,有时候弹出的下拉框会挡住页面显示内容,而且在某些情况下也不需要对input框进行记录,如号码查询的input框,用户不会对同一个号码进行多次查询,就没有必要让浏览器记录. MSIE自定义了input 的扩展属性 autocomplete,置为off即可 <input typ

谷歌,火狐浏览器不能禁用自动补齐的bug缺陷

IE浏览器里有autocomplete="off",可以禁止自动补全账号和密码,为了防止信息泄露,需要去除自动补齐. 自动补齐产生的场景是,form里面有密码框,因此只要将该密码框设置为text,点击的时候再改回password就解决了. $("#paypwd").click(function(){ $(this).attr("type","password"); });

Elasticsearch in java 范例:自动补齐功能(completion suggester)

ES(elasticsearch)的suggester共有四类(term suggester, phrase suggester, completion suggester, context suggester), 其中completion suggester作为搜索框中的自动补齐功能,尤为常用. 本文将用java语言实现一个简单例子来叙述如何使用completion suggester. 例子的主要功能是为股票的名称和编号建立自动补齐功能. 实现一个完整的completion suggeste

小技巧--tab键自动补齐Git命令

Git是什么,你不清楚? 好吧,那么该篇内容对你也木有帮助,请绕道而行.. 我们在使用Git命令时,可以通过tab键,自动补齐Git,特别是在切换分支时特别有用. 如下,当我们想将当前分支切换到bugfix/DEV-31999-review-dialog-dose-not-show-scroll时,再此之前,要么傻兮兮的敲打分支名,要么复制粘贴: 但是,倘若我们可以通过tab键自动填充目的分支,岂不完美,如下: 下面就是关于设置mac下Tab键对git命令起作用的方法: Install Bash