Kendo AutoComplete achieves multiple filtering Conditions

Multiple filtering conditions are not supported when the Kendo AutoComplete is original.

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

According to the API provided by AutoComplete, there are three filters available: startswith, endswith, Contains. But what should we do as a Chinese user. Most of the time, we hope that the searched items can be filtered by Chinese characters or pinyin, but the original AutoComplete cannot help us implement this function.

Next we will transform the autocomplete Based on AutoComplete to implement a multi-filter condition AutoComplete

The Code is as follows:

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() }            ]        });    }}));

Usage:

$ ("# Nation "). kendomultifiltercombobox ({placeholder: "Nationality... ", datatextfield:" name ", datavaluefield:" name ", filter:" contains ", datasource: [{Name: 'Han nationality, code: 'hanzu '}, <PRE name = "code" class = "JavaScript" style = "color: RGB (85, 85, 85); font-size: 14px; line-Height: 21px; "> name: 'miao nationality, code: 'miaozu '}

]});

HTML Tag:

<input id="Nation"/>

Now we have implemented the autocomplete of the combination filter conditions. The example only performs the or operation, and other operations are also possible. You can flexibly apply the operation and develop your own brain.

Kendo AutoComplete achieves multiple filtering Conditions