MVC Grid Filtering from client side JQuery

[Dan]

I currently use the MVC grid with AJAX (Client side binding).  When filtering from separate controls outside of the grid I have been using the .Filter() method and passing in a string.

While this works it does not set the filter button or text in the actual columns.  I would like to use both the client side filter capabiltiies from javascript as well as the filter in the columns.

Is there a way to set the filter icon and text value in the grid columns when the event is handled by a javascript function?

[Petur Subev]

Hello Dan,

When using the client API of the Grid to apply filtering you will need to handle and update the text and the DropDown filter type using JavaScript. Please take a look to this thread which is related to your question.


All the best,
Petur Subev
the Telerik team

[Dan]

There seems to be some inconsistency in how the grid works.  I am posting my sample code in the attachment.  Basically here is the functionality i am hoping for:

• User can leverage the filter pane.  They can enter several filters at once (without the grid refreshing) then select the filter button.
• The filter button would set each column with the values in the search pane as well as update the filter icon on top of the column
• The grid would now have the columns set through the search pane as well as additional columns set in the grid by the user separately
• Then the grid would refresh one time instead of clicking on each filter button thereby making dozens of ajax calls.

Sample test page is attached.

Problems encountered:

• How do you select just the filter settings for a specific column?  If columns get reordered how do you know which column has what filter settings through JQuery?
• How can we combine filters set outside of the grid with those inside the grid and only do 1 postback
• We would like to save the last filter settings in a cookie so getting all the settings would be best.
• Why doesnt telerik automatically set the columns filter drop downs when I call the .Filter() statement  -this seems like something that should be done by the control automatically.

[Petur Subev]

Hello Dan,

Up to your questions:

1. To get the filters for a specific column you can use the following approach:
   

   $($('#YourGridName').data('tGrid').columns).each(
           function () {
               if (this.member == 'YourColumnName') {
                   $(this.filters).each(
                   function () {
                       alert(this.operator+' '+this.value);
                   });
               }
   });

   This way the column order does not matter
2. You can assign all the filters using the filterBy property of the Grid client object to assign all the filters and then trigger the ajaxRequest() method to apply the filters.
3. You can get the filter descriptors in the GridCommand parameter in the select action method and use it to set a cookie. e.g.
   

   [GridAction]
   public ActionResult Select(GridCommand command)
   {
        var filterDescr = command.FilterDescriptors;
        //set cookie ...
   ..

4. Yes this functionality is still not supported, I have logged it into our Public Issue Tracking System. You can follow its progress and vote for it here. I have also updated your account points.

Greetings,
Petur Subev
the Telerik team