1

我正在使用 ExtJs 4，在西部区域使用 Tree 面板，在中心区域使用 TreeGrid 面板。有没有办法在选择树面板（西）时过滤树网格面板（中心区域）？

我尝试了以下但没有运气：

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);      
    }

});
4

2 回答 2

1

经过几天与这个问题的斗争，我终于能够获得该功能，尽管以一种不太令人满意的方式。此外，当前仅隐藏叶节点。

过滤所有未提及“文本”的节点：

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 = [];
}

这个解决方案有很多缺陷。包括恢复的树的节点可能会有不同的排序。但是，嘿，至少这是一些进步。

很想看到更好的！（如果它在 Ext JS 3 中运行良好，但现在这些该死的节点不再具有 .ui.hide() 函数）。

于 2011-12-08T05:59:53.803 回答
0

我已经检查了他们的示例http://dev.sencha.com/deploy/ext-4.0.2a/examples/tree/treegrid.html，实际上这里的问题是treeGrid的商店是一个树商店，它没有; 没有方法 filterBy ，方法 filterBy 在 ext.data.store 中定义，而 treeStore 扩展了 ext.data.abstractStore .. 正如我所见，您必须使用 treeStore 的过滤器配置以不同方式应用过滤器。您可以定义您的过滤器并将 filterOnLoad 设置为 true，而不是调用 filterBy 方法执行 centerTreeGrid.store.fireEvent('load',selection)。我希望这可以帮助你

编辑 我没有为树店使用过滤器，但我认为你可以做这样的事情

var treeFilter = new Ext.util.Filter({
    filterFn: function(rec) {
    console.log(rec);
    return (rec.store("text") == selection.data.text);
});

并将过滤器分配给initComponent中的treeStore

 centerGrid.store.filters.add(treeFilter);
 centerGrid.store.filterOnLoad = true;

并在 CenterTreeFilter 函数中

 centerGrid.store.fireEvent('load',selection);

Ps 代码未经测试，可能需要一些修改，但我认为这是这样做的方法。

于 2011-09-10T09:41:24.810 回答