I use Kendo UI with Angularjs, I have a grid with datasource calling remote web api and wih just server paging active (in backend I have to call a third part web service with page parameter). I want to use sort and filter on client side. Sort on columns works excellent but when i change page and try to filter on a column value in that page (the second or more), the datasource call again my backend passing page=1 and not the page's number in which i use the filter. I have to build a more advanced filter on the page so i need that filter on columns works locally without changing the page. Sort call WS with the same page's number. A workaround could be passing the current page in a different parameter to the WS, eventually could you help me with that?
4 Answers, 1 is accepted
The Kendo UI DataSource resets the current page to 1 during filtering by design and this behavior cannot be avoided. The idea is that a subset of the data items will be displayed, so the number of pages will be smaller and the current page may even not exist after the filtering.
If you require the filtering to work on the current page without making any requests to the web service, you can perform the filtering manually - retrieve all current data items, check the desired values and hide the table rows, which should not be displayed. Here are some relevant documentation links.
- get the Grid dataSource
- get all data items from the current page
- get the value of a given field of a given data item
- get the table row, which corresponds to a data item - use the data item's UID and construct a jQuery selector, having in mind that the UID is rendered as a data-uid HTML attribute of the table row.
An alternative approach would be to iterate the table rows and retrieve each row's data item separately. This will spare you the need to look for the table row, based on the data item's UID.
- retrieve all table rows
- retrieve the data item from the iterated table row
There are a couple of things to keep in mind. First, you will either need to use custom filtering UI, instead of the Grid filtering UI, or use the native filtering UI, but cancel the rebind (server request) in the Grid's dataBinding event.
Cancelling the dataBinding event is not straightforward, because the same event is also fired when paging and sorting, so you need to figure out what the user has done. This can be achieved if you save the sorting, filtering and paging state of the dataSource in the dataBound event and compare it with the state in the dataBinding event.
Also, since the Grid is not aware that it is "filtered", you will need to execute the above routine again after each paging if you want to persist the fake filtered state.
In general, you need to have the correct mindset that all the above techniques represent a hack, so if possible, consider using some other approach, which is supported out of the box.
We are using Kendo UI Grid Q2 2016 and are seeing the issue described above by Emanuele.
We are using client side filtration and server side paging. We need to be able to filter results on current page but Kendo is setting us back to page 1. Has this issue been fixed? Is there a simple work around?
All data operations in the Kendo UI DataSource are intended to be performed at the same place (client or server). Although there is a possibility to configure mixed data operations, this is a non-supported legacy.
Frankly speaking, we have no plans to alter the discussed behavior and I am afraid there is no workaround that we can offer.
Can you please describe how do you envisage client filtering plus server paging to work? We might be missing something. Here is an example - imagine a page size of 5 and two pages with the following items:
Let's assume that the user is on the second page and filters to show only items that are "greater than" 7. I suppose that the desired result is the Grid to remain on the second page and show just the three items that match the filtering criteria:
So now my question is - what should happen if the user navigates to page 1, where there are no items that match the criteria?