How to clear filter on Telerik ASP.NET MVC Grid

asp.net-mvc, jquery, telerik, telerik-mvc

Solution

With korchev's inspiration... I came up with the following that is executed before the rebind occurs. It clears out the filter values and then applies the new (non-existent) values.

//Clear UI Filter Text
$('#Groups .t-clear-button').click();
$('#Groups .t-filter-button').click();

// rebind the related grid
groupsGrid.rebind({
    userName: user
});

Problem

I have a grid that allows the user to filter. If the user changes the search word that is used to populate the grid, the filter from the previous search remains in place. ``` <label for="UserName"> User Name:</label> <%= Html.TextBox("UserName", "") %> &nbsp; &nbsp; <input id="btnSearch" type="submit" value="Submit" /> </p> <div class="<%= "t-" + Html.GetCurrentTheme() %>" style="width: 400px;"> <%= Html.Telerik().Grid<ADGroup>() .Name("Groups") .Columns(columns=> { columns.Add(c => c.GroupName).Width(350); }) .Sortable() .Filterable() .Pageable(paging => paging.PageSize(20) ) .Ajax(ajax => ajax.Action("_GetGroups", "GroupSearch", new { userName = "John Doh" })) .BindTo((IEnumerable<ADGroup>)ViewData["Groups"]) %> </div> ``` I have triggered the rebind of the gird to occur when btnSearch is pressed. ``` <% Html.Telerik().ScriptRegistrar() .OnDocumentReady(() => { %> var groupsGrid = $('#Groups').data('tGrid'); $('#btnSearch') .live("click", function() { var user = $('#UserName').val(); // rebind the related grid groupsGrid.rebind({ userName: user }); }); <% }); ``` %> I know that I can add the following code which will bring up the filter menu, but I'd prefer to be able to automagically clear the filter before or after the .rebind() call occurs. ``` $('.t-grid-filter:first') .trigger('click'); ```

Original source