kendo AutoComplete實現多篩選條件

kendo autoComplete 原始情況下是不支持多篩選條件的

$("#autocomplete").kendoAutoComplete({
  filter: "contains"
});

根據autocomplete 提供的api可以知道使用filter有三種，分別是startswith, endswith , contains。但是作爲中文使用用戶，我們該怎麼辦呢。很多時候，我們希望搜索出來的東西可以通過漢字或者拼音過濾，但是原始的autocomplete是無法幫助我們實現這以功能的。

接下來我們改造下，基於autocomplete做一個多過濾條件的autocomplete

具體代碼如下：

kendo.ui.plugin(kendo.ui.ComboBox.extend({
    options: {
        name: "MultiFilterComboBox"
    },
    _filterSource: function () {
        this.dataSource.filter({
            logic: "or",
            filters: [
                { field: "code", operator: "contains", value: this.text() },
                { field: "name", operator: "contains", value: this.text() }
            ]
        });
    }
}));

使用方法：

$("#Nation").kendoMultiFilterComboBox({
    placeholder: "民族...",
    dataTextField: "name",
    dataValueField: "name",
    filter: "contains",
    dataSource:[{name:'漢族',code:'hanzu'},<pre name="code" class="javascript" style="color: rgb(85, 85, 85); font-size: 14px; line-height: 21px;">name:'苗族',code:'miaozu'}

]});

html標籤：

<input id="Nation"/>

現在我們就實現過組合過濾條件的autocomplete,示例只是做了或運算，其他的運算也是可以的，大家可以靈活應用，開發自己的大腦。