How can I prevent a filter row from hitting the server unless the user clicks a button or presses enter?

[Developer]

I have a filter row on a grid and it seems that every time the filter inputs are used (loss of focus from tabbing out, or clicked on if radio button, or selected if dropdown) the grid hits the server. I'd like the users to have to explicitly hit enter or press a button of my choice to actually perform the data source filter request. Any ideas?

[Boyan Dimitrov]

Hello Developer,

 

I am afraid that this can not be achieved with the built-in filter row mode. It uses MVVM internally in order to handle the user interaction and filter the DataSource.

 

My suggestion is to use a complete separate filter form outside the Kendo UI Grid and use the API of the Kendo UI DataSource in order to filter the grid when user clicks on the filter button or press enter. For example filter method  will filter the data in the Kendo UI DataSource and the grid will refresh. 

 

Regards,
Boyan Dimitrov
Telerik

 

 

[Developer]

The problem with that is that it renders the filter configuration, which is quicker/easier useless and now it's a custom form outside of the framework.

Is there really no way that a function/property/event can be manipulated to make this work? This is JavaScript after all, I just haven't dug into the source enough.

[Boyan Dimitrov]

Hello Developer,

 

Indeed it will be easier to use the built-in filter menu/elements, but there is no easy way to prevent the filtering when the filter input looses its focus. Actually the main idea (by design) is to trigger the filter when user moves the focus out of the element. 

 

 

Regards,
Boyan Dimitrov
Telerik

 

 

[Developer]

I "hacked" a way together that preserves the grid functionality I need (mainly filtering/sorting/selecting). What I've done is capture specific events that I deem as allowable to go to the server. I then set a boolean field to true. Then in the dataSource requestStart event I check the boolean field and if it's false I do event.preventDefault() so that the request won't continue. I've also got a requestEnd event that sets the boolean to false every time the request finishes. This allows me to filter only on what I consider a submission as well as sort on click (the sorting had to be done because my requestStart was preventing it from working).