PDA

View Full Version : Grid with Paging & Filters: Paging does not happen after clearing filters



ilogsdev02
Oct 19, 2017, 8:59 AM
Ext.Net version: 4.5.0

When a store has both paging and grouping, and a filter is added and removed, the paging is not applied anymore (all records are shown on the first page).

This page demonstrates the issue:

<%@ Page Language="C#" %>
<%@ Register TagPrefix="ext" Assembly="Ext.Net" Namespace="Ext.Net" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager runat="server" />
<ext:GridPanel runat="server" BufferedRenderer="false">
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button runat="server" OnClientClick="addFilter();" Text="Add filter" />
<ext:Button runat="server" OnClientClick="clearFilter();" Text="Clear filter" />
<ext:Button runat="server" OnClientClick="getStore().loadPage(1);" Text="loadPage(1)" />
<ext:ToolbarTextItem runat="server" Html="PageSize: 50"></ext:ToolbarTextItem>
</Items>
</ext:Toolbar>
</TopBar>
<Store>
<ext:Store runat="server" ID="MyStore" PageSize="50">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="Group" />
<ext:ModelField Name="Val" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Features>
<ext:Grouping runat="server" />
</Features>
<ColumnModel>
<Columns>
<ext:Column runat="server" DataIndex="Val" />
</Columns>
</ColumnModel>
<BottomBar>
<ext:PagingToolbar runat="server" />
</BottomBar>
</ext:GridPanel>

<script>
Ext.onReady(function () {
var store = getStore();
var data = [];
for (var i = 0; i < 1000; i++) {
data.push({ Group: Math.floor(i / 10), Val: i });
}
store.add(data);
store.setGroupField("Group");
store.loadPage(1);
});

function getStore() {
return <%=MyStore.ClientID%>;
}

function addFilter() {
getStore().filterBy(function (x) {
return x.data.Val < 20;
});
}

function clearFilter() {
getStore().clearFilter();
}
</script>
</form>
</body>
</html>


When the page loads, 50 records (out of 1000 in the store) are shown on the first page. Then click the "Add filter" button. The filter will only accept the first 20 records. Finally, click "Clear filter". Now all 1000 records are shown on the first page. You have to manually call "loadPage(1)" again to fix the paging.

Additional information:

This only happens when the store is grouped.
Simply calling "loadPage(1);" after clearing the filter is not an acceptable solution for us, because our grid contains many columns and rows, so the performance penalty of showing all records between the clearFilter() and loadPage(1) is too big.
We cannot use a buffered renderer either, because of this issue: https://www.sencha.com/forum/showthread.php?335661-Buffered-renderer-and-grouping-feature-of-grid-cause-scroll-issues-when-used-together


Best regards,
Raphael