how to give a kendo ui autocomplete widget with multiple values, the css functionality of a kendo ui multiselect widget

Question

I am wondering if there's an easy way to have the multiselect widget's css functionality shown in this demo

http://demos.kendoui.com/web/multiselect/index.html

applied to an autocomplete widget.

Answer 1

If the only reason for using autocomplete is that the list of values is huge and you want to do server side filtering (serverFiltering) with a multiselect widget as well. You just need to define serverFiltering as true.

Example:

var ds = new kendo.data.DataSource({
    transport: {
        read: {
            url : "getData.php"
        }
    },
    serverFiltering: true
});

$("#items").kendoMultiSelect({
    dataValueField: "name",
    dataTextField : "name",
    dataSource    : ds
});

You will receive a some additional parameters saying what the user has typed so far and you server can return only the data that meets the condition.

This JSFiddle (http://jsfiddle.net/OnaBai/rpDuL/) tries to show you how it works. You can start typing a country name and see that it actually filters the data. Since this is just JavaScript I've simulated server filtering implementing a read function that greps the data for those records meeting the condition.