1
votes

my column in kendo grid with foreign key is set as filterable multi (server filtering, MVC). Default filter UI template is list of checkboxes with values. That´s cool. But this list is loading very slow, about 1-2 minutes, while everything else (paging, searching and another functions, are quick.

visualization of the problem

How can I speed up filter list loading? Thanks, Hawk

2

2 Answers

1
votes

What happens under the hood is that the request for all the data (without paging options) is made in the background when you open the filter for the first time and all of the data (for the grid) is sent from server to client. Client then selects the unique values for the corresponding field and uses them as the dataSource for the multi filter.

Paging and filtering is quicker because it pulls out only one page which is usually not larger than 50 items.

Therefore you should fill manually the filter dataSource (grid.columns.filterable.dataSource) either with static data for some enums or you can define the dataSource as any other DataSource object (with transport property) to pull the data from a remote service too.

Please see http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columns.filterable.dataSource

There is also a warning on the docs page when you use MultiCheck filtering and server paging:

If you have enabled the columns.multi option and your Grid uses serverPaging (or ServerOperations(true) when using the MVC wrappers) you will need to provide columns.filterable.dataSource. Otherwise, a negative impact on the performance could be observed.

0
votes

I am currently having the same issue as well. While I do not have a definite response at the moment, I think it may have something to do with the datasource : on the telerik/kendo site, they mention this subtly, though do not elaborate,

"field: "FirstName", title: "First Name", filterable: { multi: true , //when serverPaging of the Grid is enabled, dataSource should be provided for all the Filterable Multi Check widgets dataSource: { transport: { read: { url: telerikWebServiceBase + "Employees/Unique", dataType: "jsonp", data: { field: "FirstName" } } } } }, "

Here is the link to the full reference. I hope this helps someone find a complete answer, and I will be sure to post once I have found one as well. https://demos.telerik.com/kendo-ui/grid/filter-multi-checkboxes