欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

EasyUI--combotree模糊查询

程序员文章站 2024-02-03 21:01:10
...
<head>
    <meta charset="utf-8" />
    <title>EASY_UI搜索框</title>
</head>
<script src="jquery-easyui-1.5.5.2/jquery.min.js"></script>
<script src="jquery-easyui-1.5.5.2/jquery.easyui.min.js"></script>
<script src="jquery-easyui-1.5.5.2/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.5.5.2/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.5.5.2/themes/icon.css" />
<style>
    #select {
        width: 250px;
        height: 20px;
    }
</style>

<body>
    <div>
        <input id="select" type="text" class="easyui-combotree" data-options=" 
	    url: 'json/jxgljtree.json',
	    method:'get',
	    checkbox:true,
	    lines:true,
	    multiple:true,
	    panelHeight:150,
            panelWidth:250,
	    clickNodeForSpan:true, 
	    
            editable : true,
            keyHandler : {
                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;  
	        }  
	        }
	   }

     " />
    </div>
</body>

</html>
EasyUI--combotree模糊查询