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 = el.combobox("getData");
var value = 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;
}
});