Filter kendo grid with multiselect drop down

Question

I have a kendo grid, and an html drop down. When I configure the drop down as single select, I'm able to successfully filter the kendo grid using the string value of the selected item from the drop down.

Here's the filtering code that works when the drop down is a single select:

$("#LocationListDropDown").on("change", function(e) {
var ds = $("#grid").data("kendoGrid").dataSource;
var dropdownVal = $(this).val();
ds.filter([
    {"logic":"and",
     "filters":[
         {
            "field":"Freight",
            "operator":"eq",
            "value": dropdownVal}
     ]}
});

However, once I change that drop down to a multi-select, the filter only filters by the first selection. When the multi-select has more than one selection, the value is in an array of strings format. How do I filter the grid with multiple selections from the drop down?

D_Learning D_Learning · Accepted Answer · 2014-07-08T14:21:46

Here is the code to apply filter using multi-select:

  $("#LocationListDropDown").on("change", function(e) {
        var ds = $("#grid").data("kendoGrid").dataSource;
        var dropdownVal = $(this)..value();
        ds.filter([
            {"logic":"or", //applying "or" will get result for all multi-select values
                "filters":$.map(dropdownVal, function (valueLst) {
                    return {
                        field: "Freight",
                        operator: "eq",
                        value: parseInt(valueLst)
                    };
                })
            }
            ])
        });

Above code will create the list of filters for all the values in the multi-select selection value array.

Do let me know if your requirement is different from the above solution.

Filter kendo grid with multiselect drop down

1 Answers