I am trying to create a Kendo Angular grid control on my page with checkbox list filter on a particular column (column configuration filterable:{multi:true} didn't help.) with distinct values of that column. The custom filter I need to implement is a list of checkboxes, as in the wire frame below (only the first column and the filter is the point of focus now).
The yellow highlighted items in the list are the filter items. I don't see any out of the box feature to enable this. I have already tried with Kendo multiselect control like below to achieve this.
$scope.registryTypeFilter = function (element) {
var menu = $(element).parent();
menu.find(".k-filter-help-text").text("Show records for people working as:");
menu.find("[data-role=dropdownlist]").remove();
var multiSelect = element.kendoMultiSelect({
dataSource: _.uniq(_.pluck($scope.automationQueueItems.data(), 'RegistryType')),
itemTemplate: "<input type='checkbox' />(<label ng-bind='\'data.RegistryType\''></label>)",
tagTemplate:"$scope.dataItem"
}).data("kendoMultiSelect");
menu.find("[type=submit]").on("click", { widget: multiSelect }, filterByRegistryTypeAutomationQueue);
}But multi select control is not what is required. Has anyone tried the same before?
