PDA

View Full Version : TreeFilter



paulocordeiro
14 Sep 2010, 5:13 PM
Hi,

I tried use TreePanel + TreeFilter based on Docs.js

My filterTree method:



filterTree: function(t, e){
var text = t.getValue();
Ext.each(this.hiddenPkgs, function(n){
n.ui.show();
});
if (!text) {
this.filter.clear();
return;
}
this.expandAll();

var re = new RegExp('.*' + Ext.escapeRe(text) + '.*', 'i');
this.filter.filterBy(function(n){
return re.test(n.text);
});

this.hiddenPkgs = [];
var me = this;
this.root.cascade(function(n){
if (!n.attributes.leaf && n.ui.ctNode.offsetHeight < 3) {
n.ui.hide();
me.hiddenPkgs.push(n);
}

});
},



The problem is that filter only works in leaf nodes if also the branch node is true.

kubens
28 Sep 2010, 4:05 AM
I had the same problem in the past and I solved this without TreeFilter:


_tbarFldFilterKeyDownHandler: function(field)
{
var text = field.getValue();
if(!text)
{
this._treeFilterReset(this.tree.root.childNodes)
return;
}

this._treeFilter(this.tree.root.childNodes, text)
},

_getToolbar: function()
{
if (typeof this.toolbar == 'undefined') {
this.toolbar = new Ext.Toolbar({
cls: 'wak-toolbar'
,items: [{
xtype: 'textfield'
,width: 200
,emptyText:'Find Folder'
,enableKeyEvents: true
,listeners: {
keydown: {
fn: this._tbarFldFilterKeyDownHandler
,buffer: 350
,scope: this
}
,scope: this
}
}]
});
}

return this.toolbar;
},

_treeFilter: function(nodes,filter)
{
var regexp = new RegExp(Ext.escapeRe(filter), 'i');
Ext.each(nodes, function(node) {

node.expand(false, false, function(node) {

if (regexp.test(node.text))
{
node.ui.show();
node.bubble(function(node) { node.ui.show(); } )
}
else
{
node.ui.hide();
}

this._treeFilter(node.childNodes,filter)

}, this)

}, this);
},

_treeFilterReset: function(nodes)
{
this._treeFilter(nodes,'');
this.tree.collapseAll();
},


Wolfgang