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 = 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;
        }
    });