首页 > 代码库 > easyui combobox开启搜索自动完成功能
easyui combobox开启搜索自动完成功能
combo.json
[{ "id":-1, "text":" ", "spell":""},{ "id":1, "text":"类型1", "spell":"lx1"},{ "id":2, "text":"类型2", "spell":"lx2"},{ "id":3, "text":"类型3", "spell":"lx3"},{ "id":4, "text":"类型4", "spell":"lx4"},{ "id":5, "text":"类型5", "spell":"lx5"}]
下面是代码示例
<form> <input type="text" id="combox1"></form>
/** * easyui combobox 开启搜索功能,自动装载选中的项目处理函数 */ function onComboboxHidePanel() { var el = $(this); el.combobox(‘textbox‘).focus(); // 检查录入内容是否在数据里 var opts = el.combobox("options"); var data = http://www.mamicode.com/el.combobox("getData"); var value = http://www.mamicode.com/el.combobox("getValue"); // 有高亮选中的项目, 则不进一步处理 var panel = el.combobox("panel"); var items = panel.find(".combobox-item-selected"); if (items.length > 0) { var values = el.combobox("getValues"); el.combobox("setValues", values); return; } var allowInput = opts.allowInput; if (allowInput) { var idx = data.length; data[idx] = []; data[idx][opts.textField] = value; data[idx][opts.valueField] = value; el.combobox("loadData", data); } else { // 不允许录入任意项, 则清空 el.combobox("clear"); } } $("#combox1").combobox({ required: true, editable: true, missingMessage: ‘请选择装载物料‘, valueField: "id", textField: "text", method: ‘get‘, url: ‘combo.json‘, mode: "local", onHidePanel: onComboboxHidePanel, filter: function (q, row) { //定义当‘mode‘设置为‘local‘时如何过滤本地数据,函数有2个参数: //q:用户输入的文本。 //row:列表行数据。 //返回true的时候允许行显示。 //return row[$(this).combobox(‘options‘).textField].indexOf(q) > -1; return row["spell"].indexOf(q) >= 0; } });
easyui combobox开启搜索自动完成功能
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。