剑道下拉列表自定义过滤器答案

【问题标题】：Kendo dropdownlist custom filter剑道下拉列表自定义过滤器
【发布时间】：2016-01-12 06:57:18
【问题描述】：

我想过滤多列的下拉列表数据。目前它基于一列过滤数据。

是否有任何自定义方法可以根据多列过滤数据？

代码：

$('<input data-bind="value:' + options.field + '"/>')
                        .appendTo(container)
                        .kendoDropDownList({
                         filter: "contains",

                        dataTextField:currentComboEditor.fieldName,
                        headerTemplate: dropdownTemplateHTML.getHeaderHTML(dropdownMetadata.columns),
                        valueTemplate: '<span>#:data.'+currentComboEditor.fieldName+'#</span>',
                        template: dropdownTemplateHTML.getRowTemplate(dropdownMetadata.columns),
                        dataValueField: currentComboEditor.fieldName,
                        dataSource: {
                            data: source
                        } 
                        });

【问题讨论】：

标签： filter kendo-ui telerik dropdown kendo-dropdown

【解决方案1】：

没有内置方法可以在多列上过滤 kendoDropDownList。您可以做到这一点的唯一方法是创建自己的过滤器：

var filterValue = "search me";
var newFilter = {
    logic: "or",
    filters: [
        { field: "FieldA", operator: "contains", value: filterValue },
        { field: "FieldB", operator: "contains", value: filterValue },
        { field: "FieldC", operator: "contains", value: filterValue }
   ]
};
kendoDropDownList.dataSource.filter(newFilter);

根据您的需要，您必须将此代码挂钩到正确的事件。

【讨论】：

【解决方案2】：

覆盖Kendo dropdownlist filtering event

kendoDropDownList.bind("filtering", function(e) {
    // ignore space
    var filterValue = e.sender._prev;
    if(filterValue.trim)filterValue = filterValue.trim();

    var newFilter = {
        logic: "or",
        filters: [
            { field: "FieldA", operator: "contains", value: filterValue },
            { field: "FieldB", operator: "contains", value: filterValue },
            { field: "FieldC", operator: "contains", value: filterValue }
       ]
    };
    this.dataSource.filter(newFilter);

    // important: stop default filter
    e.preventDefault();
});

【讨论】：