Нужен простой рабочий пример фильтра дерева для extjs 3.4

Question

Как применить фильтр дерева к дереву?

Я знаю, это может показаться простым вопросом, но я новичок в extjs, занимающемся каким-то сложным кодом (с моей точки зрения). Я не могу понять, как применить фильтр дерева к панели дерева. Я нашел документацию по древовидным фильтрам here, но я не знаю, как использовать ее на панели дерева.

Вот код моего дерева панели:

{          
    xtype: 'treepanel', 
    loader: new Ext.tree.TreeLoader(), 
    itemId:'TreePanelThisUserCanSee', 
    rootVisible: false, 
    border: true, 
    autoScroll: true, 
    hideCollapseTool: true, 
    animate: false, 
    getSelectedArray: function() { 
     var selNodes = this.getChecked(); 
     var msg = ''; 
     var assignArray = new Array(); 
     Ext.each(selNodes, function(node) { 
      if(!node.disabled) { 
       if(msg.length > 0){ 
        msg += ', '; 
       } 
       msg += node.id; 
       assignArray[assignArray.length] = node.id; 
      } 
     }); 
     return assignArray; 
    }, 
    root: new Ext.tree.AsyncTreeNode({ 
     text: 'Locations', 
     draggable: false, 
     id: 'root*node', 
     leaf: false, 
     expanded: true, 
     expandable: false, 
     children: [] // must have this to programatically add 
    }), 
    listeners: { 
     'checkchange': function(node, checked) { 
     if(checked) { 
      if(node.hasChildNodes()) { 
       node.expand(false, false); 
       node.eachChild(function() { 
        this.ui.toggleCheck(true); 
        if(this.hasChildNodes()) { 
         this.eachChild(function() { 
          this.ui.toggleCheck(true); 
         }); 
        } 
       }); 
      } 
     } else { 
      node.eachChild(function() { 
      this.ui.toggleCheck(false); 
      if(this.hasChildNodes()) { 
       this.eachChild(function() { 
        this.ui.toggleCheck(false); 
       }); 
      }              
     }); 
    } 
} 
} 
} 

Answer 1

Читать this thread и проверить this example удаленного дерева с фильтром.

Также вы можете проверить этот код:

var config = { 
     readOnly: false, 
     isExpand: false, 
     mode: 'local', 
     treeFilter: new Ext.tree.TreeFilter(this.getTree(), { 
      autoClear: true, 
      filterBy : function(fn, scope, startNode){ 
       startNode = startNode || this.tree.root; 
       if(this.autoClear){ 
        this.clear(); 
       } 
       var found = {}; 
       var af = this.filtered, rv = this.reverse; 
       var f = function(n){ 
        if(n == startNode){ 
         return true; 
        } 
        if(af[n.id]){ 
         return false; 
        } 
        var m = fn.call(scope || n, n); 
        if(!m || rv){ 
         af[n.id] = n; 
         //      n.ui.hide(); 
         //      return false; 
         return true; 
        } 

        found[n.id] = n; 
        return true; 
       }; 

       startNode.cascade(f); 

       for(var idf in found){ 
        if(typeof idf != "function"){ 
         var curFoundItem = found[idf]; 
         var p = curFoundItem.parentNode; 
         while(p){ 
          delete af[p.id]; 
          p = p.parentNode; 
         } 
        } 
       } 

       for(var id in af){ 
        if(typeof id != "function"){ 
         var n = af[id]; 
         n.ui.hide(); 
        } 
       } 

       //startNode.cascade(f2); 

       if(this.remove){ 
        for(var id in af){ 
         if(typeof id != "function"){ 
          var n = af[id]; 
          if(n && n.parentNode){ 
           n.parentNode.removeChild(n); 
          } 
         } 
        } 
       } 
      } 
     }), 

     listeners: { 
      scope: this, 
      beforequery: function(){ 
       return false; 
      }, 
      keyup: { 
       fn: function(field, key){ 
        if(!this.isExpand) 
         this.expand(); 
        var value = field.getRawValue(); 
        if(Ext.isEmpty(value) && !Ext.isEmpty(field.treeFilter)){ 
         field.treeFilter.clear(); 
         return; 
        } 
        var re = new RegExp('' + value + '', 'i'); 
        var tree = field.getTree(); 
        tree.expandAll(); 
        field.treeFilter.filter(re); 
       }, 
       buffer: 250 
      } 
     } 
    } 

Я надеюсь, что это поможет вам!