How to limit Kendo multiselect to 2 items selection

Question

I want to limit kendo multiselect to 2 items selection. I see maxSelectedItems option can help me but not sure where to add this in the tag below. Any help would be appreciated.

<select class="k-widget multiselect" data-role="multiselect" id="CompSelect"
     data-placeholder=""
     data-value-primitive="true"
     data-text-field="CompNameId"
     data-value-field="CompId"
     data-bind="value: SelectedComps,
         source: CompaniesList,
         events: {
         change: onChange,
     }">
</select>

chiapa · Accepted Answer · 2015-07-16T10:25:53.297

8

You can set that easily like this:

$("#CompSelect").data("kendoMultiSelect").options.maxSelectedItems = 2;

The above code can be placed in a function for the dataBound event. That way, as soon as the data is bound to the MultiSelect it will set the maxSelectedItems.

edited Jul 16 '15 at 10:25

answered Jul 16 '15 at 08:47

chiapa

4,362
11
66
106

Any way to add this attribute in the tag itself? – CuriousBenjamin Jul 16 '15 at 08:52
1

I don't think so, even for `angularjs` I can't find anything on their documentation. You can see [here](http://docs.telerik.com/kendo-ui/api/javascript/ui/multiselect#configuration-maxSelectedItems) how they set the maxSelectedItems. – chiapa Jul 16 '15 at 08:58
It should be this, don't you think $("#CompSelect").data("kendoMultiSelect").options.maxSelectedItems = 2; – CuriousBenjamin Jul 16 '15 at 09:01
Well, that's what I answered :) – chiapa Jul 16 '15 at 09:03
Where'd you go? Show some more code, something else is preventing that from working. Your issue should be of simple resolution, the documentation shows exactly what to do and I have tested it in my own multiSelects successfully. – chiapa Jul 16 '15 at 09:28
Works for me - not very nice behavior though. Once the max selections have been made, the only way to un-select is to hit backspace, not very intuitive for the average user (but this is just a Kendo thing). – Gerry Oct 30 '17 at 21:52

score 1 · Answer 2 · answered Jan 02 '18 at 18:13

Also, check this link.

<select id="multiselect" multiple="multiple">
    <option>Item1</option>
    <option>Item2</option>
    <option>Item3</option>
    <option>Item4</option>
</select>
<script>
$("#multiselect").kendoMultiSelect({
    maxSelectedItems: 3 //only three or less items could be selected
});
</script>

How to limit Kendo multiselect to 2 items selection

2 Answers2