This is a migrated thread and some comments may be shown as answers.

Grid multi filter values

3 Answers 802 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tom
Top achievements
Rank 1
Tom asked on 09 Jan 2018, 01:05 PM

I am trying to reduce the amount of back-and-forth on a number of columns that are configured to use multi-checkbox filtering, as per the below example:

.Columns(columns => { columns.Bound(c => c.Status).Filterable(f => f.Multi(true) })

I would like to set the available values of this filter. The default behaviour is for the entire dataset to be re-requested and returned to the user, where a distinct list of values can be deduced. I am able to implement a more efficient solution for my particular case, but I cannot seem to set the available values of these filters. Finding the relevant th object and setting the data as follows does not seem to work:

var myGrid = $("#MyGrid").data("kendoGrid");
var listOfFilterValues = [{"Status": "first"},{"Status": "second"},{"Status": "etc"}];
myGrid.thead.find("th").each(function (i,s) {
    if($(s).data("field") == "Status" && $(s).data("kendoFilterMultiCheck") != null){
        $(s).data("kendoFilterMultiCheck").checkSource.data(listOfFilterValues );
    }
}

Is this possible? If so, how?

3 Answers, 1 is accepted

Sort by
0
Konstantin Dikov
Telerik team
answered on 11 Jan 2018, 09:38 AM
Hello Tom,

The easiest way for achieving the desired result would be to set separate DataSource for the filter (refer to configuration of the second Grid):
You can also use BindTo to a collection:
columns.Bound(e => e.FirstName).Width(220).Filterable(ftb => ftb.Multi(true).BindTo(new List<EmployeeViewModel>() { new EmployeeViewModel() { FirstName = "Test"} })
);

As for custom solution within the filterMenuInit event, you can take a look at the implementation in the following HowTo article, where the checkboxes are recreated when their data changes:
Hope this helps.


Regards,
Konstantin Dikov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Tom
Top achievements
Rank 1
answered on 11 Jan 2018, 11:29 AM

Sorry, but this doesn't really address what I am trying to achieve. I am aware a separate datasource can be specified and bound to a specified list, but this only works if the available values are known when the grid is defined, and never change. Setting this datasource to call a separate controller action is something I am specifically trying to avoid here.

What I am trying to achieve here is to change the filter values on the page on the fly, using javascript. No calls to controller actions, no pre-defined lists.

Is this possible, and if so, how?

0
Tsvetina
Telerik team
answered on 15 Jan 2018, 11:17 AM
Hi Tom,

You can change the data used in the multi-checkbox filter on the fly in the filterMenuOpen and filterMenuInit events.

You can use this example as a base:
Sort Multiple Checkbox Filter

You can modify it to use the filterMenuOpen event instead of filterMenuInit one to be able to replace the filter checkboxes DataSource each time the filter menu opens and some condition is fulfilled.

Regards,
Tsvetina
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Tom
Top achievements
Rank 1
Answers by
Konstantin Dikov
Telerik team
Tom
Top achievements
Rank 1
Tsvetina
Telerik team
Share this question
or