首页 > 代码库 > 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开启搜索自动完成功能