【问题标题】:How to filter grid data with paging in ExtJS 5如何在 ExtJS 5 中使用分页过滤网格数据
【发布时间】:2016-03-05 04:38:55
【问题描述】:

我正在尝试将过滤器应用于具有活动分页的数据存储。 我目前正在使用静态数据存储而不是使用代理。 但是,过滤器将应用于数据网格中显示的当前页面,而不是整个数据存储。

案例 1: 我尝试停用分页,应用过滤器,然后再次激活分页。但是,过滤器对当前页面有效,而不是对整个数据存储区。

案例 2: 在应用 案例 1 之前,我尝试将排序器添加到数据存储区。它也没有用。

有什么方法可以过滤所有数据并在分页中显示过滤结果?

注意:我试图在 Sencha Fiddle 上写一个类似的代码,但 grid 没有在这个 fiddle 上分页,there is sample code

【问题讨论】:

    标签: javascript extjs extjs5


    【解决方案1】:
    1. 静态存储数据不支持分页,因为分页是由代理和读取器完成的。但是,您可以使用enablePaging:truepagingmemory 代理(ExtJS 4)或memory 代理(ExtjS 5/6)上定义数据。

    2. 对于ajax 代理,分页是通过向服务器发送页面大小和启动属性来完成的。如果服务器忽略这些属性并返回它在数据库中的所有内容,则分页对ajax 代理不起作用。服务器可能只发回应该在网格中可见的记录。

    3. 请注意,ajax 代理还必须提供 totalCount 才能使分页正常工作。要查看 pagingToolbar 的工作情况,请添加到您的商店:totalCount:25。瞧,你的 pagingToolbar 显示有五个页面。其他一切都无法正常工作,因为请参阅 1. 再次删除 totalCount,它对您没有任何帮助。

    4. 通常totalCount 由服务器传送并由读者提供给商店:如果服务器在totalProperty 属性中设置的位置返回totalCount,则JsonReader 传送totalCount

    5. 如果您使用分页并且希望始终看到 25 个应用了正确排序和过滤的条目,则必须使用 remoteSort:trueremoteFilter:true。如果是AjaxProxy,则必须在服务器端实现过滤和排序。

    6. 您在客户端应用的过滤器将始终在分页后应用,因为分页发生在服务器端。它们不能是您设置远程过滤器的同一商店的一部分,因此您必须将您的网格绑定到以您的原始商店作为源的 ChainedStore。然后将客户端过滤器应用于链式存储,并将远程过滤器应用于原始存储。

    【讨论】:

    • 你对,我明白了,我的方法是错误的,而且它只是一个 Web 应用程序,它应该在服务器端做具有挑战性的工作,就像那样。谢谢。
    • 当你有memory 代理和pagingEnabled 配置(在旧的ExtJS 版本pagingmemory 代理),你可以有分页本地数据和分页发生在本地。但是问题依然存在,分页是在排序和过滤之前应用的。
    • 我在Sencha forum thread 中找到了解决方案。要正确排序和过滤本地数据remoteSortremoteFilter 存储配置必须设置为通过代理过滤和排序数据。
    • @MarthyM 感谢您的反馈,我更新了我的答案
    猜你喜欢
    • 2012-08-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-06-04
    • 1970-01-01
    • 2020-06-12
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多