Group breaks Filtering

[Mark]

if I add:

.Group(g => {
                g.Add(c => c.DistrictName);
                g.Add(c => c.SchoolName);
                })

to my datasource:

.DataSource(ds => ds
            .Ajax()
            .ServerOperation(false)
            .Read(read => read.Action("RetrieveReqStatusReport", "ReportSupport", new { orgId = ViewBag.OrgSelection.Id, personId = ViewBag.PersonId, yearId = ViewBag.YearSelection.Id }))
            .PageSize(50)
            .Group(g => {
                g.Add(c => c.DistrictName);
                g.Add(c => c.SchoolName);
                })
        )

then

 function filterMenuInit(e) {
        if (e.field == "DueDate") return;
        var filterMultiCheck = this.thead.find("[data-field=" + e.field + "]").data("kendoFilterMultiCheck")
        filterMultiCheck.container.empty();
        filterMultiCheck.checkSource.sort({ field: e.field, dir: "asc" });

        filterMultiCheck.checkSource.data(filterMultiCheck.checkSource.view().toJSON());
        filterMultiCheck.createCheckBoxes();
    }

generates the following error when I try to filter:

Uncaught ReferenceError: DistrictName is not defined
    at eval (eval at compile (kendo.all.min.js:25), <anonymous>:3:209)
    at Object.render (kendo.all.min.js:25)
    at Object.d [as render] (jquery.min.js:2)
    at init.createCheckBoxes (kendo.all.min.js:45)
    at init.filterMenuInit (1:371)
    at init.trigger (kendo.all.min.js:25)
    at init.c (kendo.all.min.js:53)
    at init.trigger (kendo.all.min.js:25)
    at init._init (kendo.all.min.js:45)
    at init._click (kendo.all.min.js:45)

if I remove it, multi-filter works fine.

TIA for the insight into what I'm failing to understand.

[Stefan]

Hello, Mark,

Thank you for the provided details.

After inspecting it I noticed that the issue occurs because the dataSource.view() returns the data in a different format if the Grid is grouped.

https://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-view

In this scenario, I can suggest using the data method instead of the view() method.

filterMultiCheck.checkSource.data(filterMultiCheck.checkSource.data().toJSON());

I hope this is helpful.

Regards,
Stefan
Progress Telerik

[Rakesh]

Stefan..

 

After grouping, I wasnt able to get hold of filterMultiCheck object through  either of the below

this.thead.find(".k-filterable").data("kendoFilterMultiCheck");

this.thead.find("[data-field=" + e.field + "]").data("kendoFilterMultiCheck");

 

Should I be using some other selector if the data is grouped?

 

 

[Mark]

thanks!

[Stefan]

Hello, Rakesh,

The example is still working on my end after grouping the Grid as well.

Please check the following example demonstrating this:

http://dojo.telerik.com/omEgOW

Please let me know if I missed an important detail.

Regards,
Stefan
Progress Telerik

[SEAN]

I tried using the data() method as you suggested but I was also using a filter to remove some values from the results so I needed to use the view() method. I managed to get it working by using the view() method, which returns the wrong format, but I was able to get to the right format as follows:

var viewArray = new kendo.data.ObservableArray(filterMultiCheck.checkSource.view()[0].items); // for grouped grids, wrap the view results in an ObservableArray
filterMultiCheck.checkSource.data(viewArray.toJSON());