This is a migrated thread and some comments may be shown as answers.

Client-Side Filtering with Pager

7 Answers 314 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Cyndie
Top achievements
Rank 1
Cyndie asked on 27 Jun 2014, 03:45 PM
I have a ListView, DataSource and Pager.  The DataSource queries the data from a remote source and there is a total function in the schema for the pager which works fine for the remote query.  The problem I'm having is if I apply a filter to the DataSource client-side, the pager is not updating to the new filtered total and is still using the full dataset total.  The ListView is displaying the filtered results and if I click next on the pager, it exceeds the end of the filtered set and crashes.

relayDataSource.filter = { field: "MakeModelID", operator: "equals", value: this.value() };

schema: {
   data: "d",
   total: function(data){
     return data.d.length;
   },

Is there a way to get the pager to work with client-side filtering on a remote dataSource?  Pager.refresh() doesn't get a filtered total and I prefer to limit the hits on the server by filtering client-side.

Thanks.

7 Answers, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 01 Jul 2014, 04:12 PM
Hi Cyndie,

I tried to reproduce the behaviour in a sample page but to no avail. Could you please check it and let me know what I am missing?

I also recorded a screen cast: http://screencast.com/t/TVAPpwCmq
As you can see the dataSource fires requests for paging but does not fire requests for filtering, e.g. the paging is performed server side while filtering occurs on the client.

On a side note I would not recommend using client side filtering and server side paging as in this case the user will be able to filter only the records which are part of the current page. This behaviour might be confusing.

Regards,
Alexander Valchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Cyndie
Top achievements
Rank 1
answered on 01 Jul 2014, 04:42 PM
Your demo is with a grid, which may work fine as it has built-in filtering that can be configured.  The problem I'm having is with a ListView, which doesn't have the filtering configuration. 
0
Accepted
Alexander Valchev
Telerik team
answered on 02 Jul 2014, 11:08 AM
Hi Cyndie,

Please accept my apology for the misunderstanding.

I modified the example so it now uses ListView  with pager but did not manage to reproduce the behavior. Am I missing something? Does the sample matches your scenario, if not could you please modify it?

Regards,
Alexander Valchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Cyndie
Top achievements
Rank 1
answered on 03 Jul 2014, 01:08 PM
In trying to edit your example to be configured like mine, I found the issue.

I was using the following to apply the filter
relayDataSource.filter = { field: "MakeModelID", operator: "equals", value: this.value() };

instead of
relayDataSource.filter({ field: "MakeModelID", operator: "equals", value: this.value() });

Making that change made the difference.

Thanks.
0
CS
Top achievements
Rank 2
answered on 16 Mar 2015, 01:45 PM
Hi Alexander,

Can you please repost the example with the grid because now both examples are with the listviews. I'm currently struggling preventing requests while client side filtering.
0
Alexander Valchev
Telerik team
answered on 18 Mar 2015, 08:39 AM
Hello,

Here you are: http://dojo.telerik.com/@valchev/OLEgU

Regards,
Alexander Valchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Randolph
Top achievements
Rank 1
answered on 16 Nov 2015, 05:36 AM

Hi,

 

 So I was looking for an answer to this as well and found a good solution that might help which uses the dataSource.query method. Here is the link for the dojo: http://dojo.telerik.com/elemI

 

Regards,

Randolph

 

Tags
Data Source
Asked by
Cyndie
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Cyndie
Top achievements
Rank 1
CS
Top achievements
Rank 2
Randolph
Top achievements
Rank 1
Share this question
or