ExtJS4：树网格面板过滤器

我使用的ExtJS4在西部地区有一个树面板，在中部地区有一个树面板。在选择treepanel（西部）时，是否有办法过滤TreeGrid面板（中心区域）

我尝试了以下方法，但没有成功：

Ext.define（'MyApp.view.MyViewport'{
扩展：“MyApp.view.ui.MyViewport”，
initComponent:function（）{
var me=这个；
me.callParent（参数）；
me.down（“#westTreePanel”）.getSelectionModel（）.on（'selectionchange'，me.CenterTreeFilter，me）；
}，//初始化组件的结尾
CenterTreeFilter:函数（）{
var selection=this.down（“#westTreePanel”）.getView（）.getSelectionModel（）.getSelection（）[0]；
var centerTreeGrid=this.down（“#centerTreeGrid”）；
console.log（selection.data.text）；
centerTreeGrid.store.filterBy（函数（rec，id）{
控制台日志（rec）；
返回（rec.store（“text”）==selection.data.text）；
});
console.log（“子存储：+this.down（'#centerTreeGrid'）.getStore（）.storeId）；
}
});

我已经检查了他们的示例，事实上这里的问题是treeGrid的存储是一个树存储，它没有；没有方法filterBy，方法filterBy在ext.data.store中定义，treeStore扩展了ext.data.abstractStore。。在我看来，您必须使用树顶的过滤器配置，以不同的方式应用过滤器。您可以定义筛选器并将filterOnLoad设置为true，而不是调用filterBy方法，即执行centerTreeGrid.store.fireEvent（'load'，selection）。我希望这对你有帮助

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

var treeFilter=new Ext.util.Filter({
过滤器Fn：功能（rec）{
控制台日志（rec）；
返回（rec.store（“text”）==selection.data.text）；
});

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

centerGrid.store.filters.add（treeFilter）；
centerGrid.store.filterOnLoad=true；

和在CenterTreeFilter函数中

centerGrid.store.firevent（'load'，selection）；

---

p.s代码未经测试，可能需要进行一些修改，但我认为这是解决问题的方法。

我检查了他们的示例，实际上这里的问题是treeGrid的存储是一个树存储，它没有方法filterBy，方法filterBy在ext.data.store中定义，treeStore扩展了ext.data.abstractStore..在我看来，您必须使用treeStore的filters配置以不同的方式应用过滤器。您可以定义过滤器并将filterOnLoad设置为true，而不是调用filterBy方法do centerTreeGrid.store.fireEvent（'load'，selection'）。我希望这对您有所帮助

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

var treeFilter=new Ext.util.Filter({
过滤器Fn：功能（rec）{
控制台日志（rec）；
返回（rec.store（“text”）==selection.data.text）；
});

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

centerGrid.store.filters.add（treeFilter）；
centerGrid.store.filterOnLoad=true；

和在CenterTreeFilter函数中

centerGrid.store.firevent（'load'，selection）；

p.s代码未经测试，可能需要进行一些修改，但我认为这是解决问题的方法。

经过几天的努力，我终于能够获得功能，尽管不是很令人满意。此外，目前只有叶节点被隐藏

筛选所有未提及“文本”的节点：

t.getRootNode（）.cascadeBy（函数（n）{
如果（！n.hasChildNodes（）&&
n、 原始（&n.raw.text.toLowerCase（）.indexOf（text.toLowerCase（））<0）{
push（{node:n，parent:n.parentNode}）；
}
});

要稍后恢复，请运行：

函数restoreTrees（）{
for（toRemove中的var n）{
toRemove[n].parent.appendChild（toRemove[n].node）；
}
toRemove=[]；
}

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

我很想看到一个更好的！（它在Ext JS 3中运行得很好，但是现在这些该死的节点不再有.ui.hide（）函数了）。

在与这个问题斗争了几天之后，我终于能够获得该功能，尽管不是很满意。而且，目前只有叶节点被隐藏

筛选所有未提及“文本”的节点：

t.getRootNode（）.cascadeBy（函数（n）{
如果（！n.hasChildNodes（）&&
n、 原始（&n.raw.text.toLowerCase（）.indexOf（text.toLowerCase（））<0）{
push（{node:n，parent:n.parentNode}）；
}
});

要稍后恢复，请运行：

函数restoreTrees（）{
for（toRemove中的var n）{
toRemove[n].parent.appendChild（toRemove[n].node）；
}
toRemove=[]；
}

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

---

我很想看到一个更好的！（它在ExtJS3中运行得很好，但现在这些该死的节点没有了.ui.hide（）函数）.

您可以从控制台发布日志吗？nscrob:当然。以下是控制台日志：：Single Product Packs MyViewport.js:sub store:centerTreeGridStore..它不在filterBy函数.me.down（“#westTreePanel”）.getSelectionModel（）中（'selectionchange'，me.CenterTreeFilter，me）；从这一行来看，这是一个带有布局边框的容器……但这一行的确切名称是什么？它应该在组件的initConfig中..因为在我看来centertreefilter没有被调用..它是console.log（selection.data.text）；正在显示？？我已经编辑并提供了ref.console.log（rec）的完整代码没有被执行