如何在ExtJS中应用过滤器

Question

我正在使用：

Ext.ux.grid.FiltersFeature

它工作正常，但每当我加载我的商店数据

tablePanel.store.loadData(..)

不遵守过滤器。这些列在视觉上被选为过滤（即灰色），但显示的是所有行而不是过滤的行子集。

以下是JSFiddle中的错误：

http://jsfiddle.net/oliverwatkins/7hbt79bj/4/

重现我的问题：

• 在名称上选择列过滤器，选择值'foo'
• 现在只显示一行（foo行）
• 现在点击重置。
• 过滤器设置为仅显示'foo'，但它也显示'bar'。

我知道有一种方法可以删除过滤器：

grid.store.clearFilter();

我正在寻找这样的方法：

grid.store.applyFilters();

所以我可以在刷新表格中的数据后执行它。

**更新**

如果我深入挖掘，我可以看到在表格面板中设置了一个过滤字符串。

tablePanel - ＆gt;过滤器 - ＆gt;过滤器 - ＆gt;项目 - ＆gt; [1] - ＆gt; inputItem - ＆gt; value ='mySearchString'

然而，这是tablePanel上的过滤器。如果我查看tablePanel - ＆gt;存储，我会找到没有设置项目的过滤器：

tablePanel - ＆gt;商店 - ＆gt;过滤器 - ＆gt;过滤器 - ＆gt;项目 - ＆gt; [0]

这里几乎就好像有两个不同的过滤系统正在相互通信。

让事情更令人愤怒的是商店有一个过滤器方法，而网格没有过滤方法。

grid.store.filter(); //method exists

grid.filter(); //crashes

令人费解..

Answer 1

我使用了your fiddle并提出了一个在存储加载后设置值的解决方案。在grid.store.loadData之后，我添加了这个代码，逐个重新应用过滤器。

var filterData = grid.filters.getFilterData();
Ext.Array.each(filterData, function(filter){
    grid.filters.filters.getByKey(filter.field).setValue(filter.data.value)
})

Answer 2

这里的问题是网格过滤器功能创建了底层商店过滤机制的接口。如果您绕过功能界面并直接进入商店，过滤器就不会知道它并感到困惑。

因此，只使用FiltersFeature定义的API，一切都应按预期工作。例如，要清除过滤器，请使用：

 grid.filters.clearFilters()