Extjs 树支持模糊查询定位

来源:互联网 发布:湘西蛊毒 知乎 编辑:程序博客网 时间:2024/06/01 10:43
var rightTree = new Ext.tree.TreePanel({
region : 'center',
split : true,
animate:true, //展开,收缩动画
xtype : 'treepanel',
width : 240,
autoScroll : true,
id : 'tree',
// collapsible : true,
title : '区域列表',
loader : new Ext.tree.TreeLoader( {
dataUrl : ctx + '/hbms/installGroupGuard/installGroupGuard.action?method=queryParam&imUnitName='+encodeURI(encodeURI(r.get('imUnitName')))
+'&imGroupName='+encodeURI(encodeURI(r.get('imGroupName')))
}),
root : new Ext.tree.AsyncTreeNode( {
id : "SZ",
text : "深圳",
leaf : false
}),
tbar:[{  
            icon: ctx + "/images/xtree/Tplus.png",  
            tooltip: '展开',  
            handler: function(){ rightTree.expandAll(); },  
            scope: this  
          }, '-', {  
            icon: ctx + "/images/xtree/Tminus.png",  
            tooltip: '收缩',  
            handler: function(){ rightTree.collapseAll(); },  
            scope: this  
          }
         /* , new Ext.form.TextField({  
                width: 150,  
                emptyText:'快速检索',  
                enableKeyEvents: true,//给输入框绑定keyup事件,需要加上enableKeyEvents:true才能让extjs的textfield代理鼠标事件  
                listeners:{  
                    keyup:function(node, event) {  
                        findByKeyWordFiler(node, event);  
                    },  
                    scope: this  
                }  
        })*/
          ],
listeners : {
checkchange : function(node, checked) {
if(checked){
  treeCheckTrue(node);
}else{
  treeCheckFalse(node);
}
var flag = false;
for(var i=0;i<params.length;i++){
if(params[i].commId == node.id){
params[i].commName = node.text;
params[i].checked = checked;
flag = true;
break;
}
}
if(!flag){
var param = {};
param.commId = node.id;
param.commName = node.text;
param.checked = checked;
params.push(param);
}
}
}
});
// rightTree.expandAll(); 
var timeOutId = null;
var filterTreeFiled = new Ext.form.TextField({  
   width:115,  
   emptyText:'快速检索',  
   enableKeyEvents: true  
});  
var tbar = rightTree.getTopToolbar();  
tbar.add(filterTreeFiled);tbar.doLayout();
var selectNode = function(node) {  
   node.ensureVisible();  
   node.select();
//    Ext.tree.MultiSelectionModel.select();
   node.fireEvent('click', node);  
}  
function onExpandPathComplete(bSuccess, oLastNode) {  
   if (!bSuccess)  
       return;  
   // focus 节点,并选中节点!  
   selectNode(oLastNode);  
}
var findByKeyWordPath = function(node, event) {
   clearTimeout(timeOutId);  
   timeOutId = setTimeout(function() {  
               var text = node.getValue().trim();  
               lastSerach=text; 
               // 采用ajax获得需要展开的路径  
               if (text != "") {  
                   Ext.Ajax.request({  
                               params : {  
                                   keyWord : text  
                               },  
                               url :ctx + '/hbms/installGroupGuard/installGroupGuard.action?method=searchNode',  
                               method : 'POST',  
                               async : false,  
                               success : function(response, opts) {  
                                   var obj = Ext.decode(response.responseText); 
                                   console.log(obj);
                                   if(obj.success){  
                                       var length = obj.list.length;
                                       rightTree.root.reload();  
                                       for(var i=0;i<length;i++){
                                           var path = obj.list[i].path;
                                                rightTree.expandPath("/SZ"+path,'id',onExpandPathComplete);  
                                       }
                                   }
                                   },  
                               failure : function(response, opts) {  
                                   Ext.Msg.alert("错误提示", "请求失败,请与管理员联系。").setIcon(Ext.MessageBox.ERROR);  
                               }  
                           });  
               } else {  
               }  
           }, 500);  
}  
filterTreeFiled.on("keyup", function(node, event) {  
   findByKeyWordPath(node, event);  
});  
/** 
*checkTree全选 
*/ 
var treeCheckTrue = function(node) 

node.eachChild(function (child) { 
child.getUI().toggleCheck(true); 
child.attributes.checked = true; 
treeCheckTrue(child); 
});}
/**
* checkTree取消
*/
var treeCheckFalse = function(node) 

node.eachChild(function (child) { 
child.getUI().toggleCheck(false); 
child.attributes.checked = false; 
treeCheckTrue(child); 

});}


0 0