ExtJs 4:树网格面板过滤器 [英] ExtJs 4 : Tree grid panel filter

问题描述

我将ExtJs 4与西部区域的Tree面板和中部区域的TreeGrid面板一起使用.在选择treepanel(west)时是否有任何方法可以过滤TreeGrid面板(中心区域)?

I am using ExtJs 4 with a Tree panel on west region and TreeGrid panel on center region. Is there any way to filter the TreeGrid panel(center region) on selection of the treepanel(west) ??

我尝试了以下方法，但是没有运气:

I tried the following but no luck :

Ext.define('MyApp.view.MyViewport', {
    extend: 'MyApp.view.ui.MyViewport',

 initComponent: function() {

        var me = this;
        me.callParent(arguments);   
        me.down('#westTreePanel').getSelectionModel().on('selectionchange',me.CenterTreeFilter,me);

}, //end of initComponent

CenterTreeFilter: function(){

    var selection = this.down('#westTreePanel').getView().getSelectionModel().getSelection()[0];
    var centerTreeGrid = this.down('#centerTreeGrid');
    console.log(selection.data.text);

    centerTreeGrid.store.filterBy(function(rec, id){
         console.log(rec);
         return (rec.store("text") == selection.data.text);
    });
    console.log("sub store : " + this.down('#centerTreeGrid').getStore().storeId);      
    }

});

推荐答案

在解决了这个问题的天之后，尽管不是很令人满意，但我终于能够获得该功能.此外，当前仅隐藏叶节点.

After days of fighting with this issue, I was finally able to get the functionality, albeit in a not so satisfying way. Also, only leaf nodes are currently hidden.

过滤所有不提及文本"的节点:

filtering all nodes that don't mention "text":

t.getRootNode().cascadeBy(function(n){
    if (!n.hasChildNodes() && 
        n.raw && n.raw.text.toLowerCase().indexOf(text.toLowerCase()) < 0) {
        toRemove.push({ node: n, parent: n.parentNode });
    }
});

要稍后还原，请运行:

function restoreTrees() {
    for (var n in toRemove) {
        toRemove[n].parent.appendChild(toRemove[n].node);
    }
    toRemove = [];
}

此解决方案有很多缺陷.包括恢复的树可能对其节点具有不同的顺序.但是，至少，这是一些进步.

There are many flaws with this solution. Including that the restored tree will probably have a different ordering for their nodes. But hey, at least this is some progress.

希望看到更好的一个！ (它在Ext JS 3中运行得很好，但是现在这些织补节点不再具有.ui.hide()函数了.)

Would love to see a better one! (Had it working beautifully in Ext JS 3, but now these darn nodes don't have a .ui.hide() function any more).

这篇关于ExtJs 4:树网格面板过滤器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！