EasyUI treegrid checkbox复选框 显示或隐藏

这里说的模糊查询指在输入框输入，然后自动在下拉框中显示匹配结果，类似Google搜索提示
EasyUI库已经实现了combobox的查询过滤功能，但只能从头匹配，原因是EasyUI库的代码限制：

filter: function(q, row){  
    var opts = $(this).combobox('options');  
    return row[opts.textField].indexOf(q) == 0;  
}  

combobox有一个filter属性，通过这个属性来实现查询效果，在EasyUI库或本地combobox控件中修改这个filter方法就可以实现自定义查询效果

复制代码

$('#businessCityNo').combobox({  
    valueField : 'businessCityNo',  
    textField : 'businessCityName',  
    editable:true ,  
    required: true,  
    filter: function(q, row){  
        var opts = $(this).combobox('options');  
        return row[opts.textField].indexOf(q) >= 0;//这里改成>=即可在任意地方匹配  
    },  
    data : d.rows,  
});  

当然，直接在生成combobox的地方来添加filter，有多少个就得添加多少次，很麻烦，简单一点，在本地js文件中覆盖这个filter：

$.fn.combobox.defaults.filter = function(q, row){  
    var opts = $(this).combobox('options');  
    return row[opts.textField].indexOf(q) >= 0;  
}  

combobox可以通过重写filter方法来实现自定义匹配方式，是因为EasyUI库有对filter属性的底层支持，EasyUI的官方文档中明确提到combobox的属性列表，其中就有filter;
但是，EasyUI并没有为combotree提供filter属性，也就是说没有重写filter方法的根据。
那么，要使combotree实现查询功能，只能通过扩展代码，在EasyUI库或者本地js文件中加入以下代码：

(function(){  
    $.fn.combotree.defaults.editable = true;  
    $.extend($.fn.combotree.defaults.keyHandler,{  
        up:function(){  
            console.log('up');  
        },  
        down:function(){  
            console.log('down');  
        },  
        enter:function(){  
            console.log('enter');  
        },  
        query:function(q){  
            var t = $(this).combotree('tree');  
            var nodes = t.tree('getChildren');  
            for(var i=0; i<nodes.length; i++){  
                var node = nodes[i];  
                if (node.text.indexOf(q) >= 0){  
                    $(node.target).show();  
                } else {  
                    $(node.target).hide();  
                }  
            }  
            var opts = $(this).combotree('options');  
            if (!opts.hasSetEvents){  
                opts.hasSetEvents = true;  
                var onShowPanel = opts.onShowPanel;  
                opts.onShowPanel = function(){  
                    var nodes = t.tree('getChildren');  
                    for(var i=0; i<nodes.length; i++){  
                        $(nodes[i].target).show();  
                    }  
                    onShowPanel.call(this);  
                };  
                $(this).combo('options').onShowPanel = opts.onShowPanel;  
            }  
        }  
    });  
})(jQuery);

如果在公共EasyUI库中加入以上代码，就可以在本地重写query方法来实现和combobox一样的自定义查询效果；如果是本地可以直接更改query实现自定义。

 $.fn.combotree.defaults.editable = true;  
 $.extend($.fn.combotree.defaults.keyHandler,{  
     up:function(){  
         console.log('up');  
     },  
     down:function(){  
         console.log('down');  
     },  
     enter:function(){  
         console.log('enter');  
     },  
     query:function(q){  
         var t = $(this).combotree('tree');  
         var nodes = t.tree('getChildren');  
         for(var i=0; i<nodes.length; i++){  
             var node = nodes[i];  
             if (node.text.indexOf(q) >= 0){  
                 $(node.target).show();  
             } else {  
                 $(node.target).hide();  
             }  
         }  
         var opts = $(this).combotree('options');  
         if (!opts.hasSetEvents){  
             opts.hasSetEvents = true;  
             var onShowPanel = opts.onShowPanel;  
             opts.onShowPanel = function(){  
                 var nodes = t.tree('getChildren');  
                 for(var i=0; i<nodes.length; i++){  
                     $(nodes[i].target).show();  
                 }  
                 onShowPanel.call(this);  
             };  
             $(this).combo('options').onShowPanel = opts.onShowPanel;  
         }  
     }  
 });  

更详细内容请见：地址