Filter after search

[Lee]

I have a kendo ui jquery datasource that I'm using to populate my grid. I have added a custom toggle switch to show only active accounts or show all accounts. The switch works by calling the following function on change: 

    $(".my-page").on("change", "#myTableStatusToggle", function () {
        if ($("#myTableStatusToggle:checked").length > 0) {
            dataSource.filter({});
        } else {
            dataSource.filter({ field: "Status", operator: "eq", value: "Active" });
        }
    });

Unfortunately there is also a search box (the standard grid search box) and when the user types in the search box it searches all records. When the user clears out the search box it shows all of the records even though the toggle switch hasn't been touched. How do I search the grid while still respecting the toggle switch? 

[Neli]

Hello Lee,

What you could try in order to customize the search filter is to detach the default handler and attach a custom one. Within the handler, you could add the additional filter. Below you will find the code snippet to unbind from the built-in search panel code and implement your own logic:

var container = $(".k-grid-toolbar");
container.off("input",".k-grid-search input").on("input",".k-grid-search input",function(e) {
  alert();
});

Here is a small Dojo example that demonstrates the suggestion above

You could find another example of customizing the Search filter in the How_To article linked below:

- https://docs.telerik.com/kendo-ui/knowledge-base/grid-search-panel-with-multiple-values

I hope this helps.

Regards,
Neli
Progress Telerik