如何在 ExtJS 中应用过滤器答案

【问题标题】：How do I apply filter in ExtJS如何在 ExtJS 中应用过滤器
【发布时间】：2014-09-28 01:38:55
【问题描述】：

我正在使用：

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 --> 过滤器 --> 过滤器 --> 项目 --> [1] --> inputItem --> value = 'mySearchString'

但是，那是 tablePanel 上的过滤器。如果我查看 tablePanel-->store，我会发现没有设置项目的过滤器：

tablePanel --> store --> filters --> filters --> items --> [0]

就好像这里有两个不同的过滤系统在起作用，它们没有相互通信。

更让人气愤的是store有filter方法，而grid没有filter方法。

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

grid.filter(); //crashes

令人费解..

【问题讨论】：

如果列显示它们正在被过滤，但结果没有，那么过滤值可能没有正确传递到您的服务器（假设您正在使用远程过滤） .
不使用远程过滤
好吧，即使使用本地过滤，如果过滤器处于活动状态并且具有值，则应该在刷新商店时应用它。如果您使用列菜单中的菜单激活过滤器，过滤器是否有效？
嗯嗯，它工作正常。它只是商店的加载。执行 store.loadData() 后是否需要执行 store.refresh() 之类的操作？
查看loadData 的源代码，它似乎检查filterOnLoad 是否设置为true，如果是，则调用filter 方法。我知道这是使用默认的商店过滤，但也许FiltersFeature 也使用它。因此，您可以尝试将filterOnLoad: true 和（我假设这已设置）remoteFilter: false 添加到您的商店配置中。

标签： extjs extjs4

【解决方案1】：

这里的问题是网格过滤器功能为底层存储过滤机制创建了一个接口。如果绕过功能界面直接下到商店，过滤器不知道会糊涂。

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

 grid.filters.clearFilters()

【讨论】：

是的，但我没有看到任何像 grid.filters.applyFilters() 这样的方法。
有addFilters 和addFilter 方法。他们不这样做吗？
是的，他们添加了过滤器。但是我已经添加了过滤器并且没有任何事情发生。（往上看）。就像商店过滤器和网格过滤器不相互交谈。
是的，它可能是 Ext 或应用程序中的错误。你能在fiddle.sencha.com 准备一个工作展示吗？我去看看。
正在尝试，但我不知道如何导入 FiltersFeature。（查看我在 StackOverflow 上的最新问题）

【解决方案2】：

我使用了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)
})

【讨论】：

1 秒的延迟有点烦人……但我会给你的 :)