MultiSelect Overview

The MultiSelect displays a list of options and allows multiple selections from this list.

The widget represents a richer version of the <select> element and provides support for local and remote data binding, item and tag templates, and configurable options for controlling the list behavior.

Kendo UI for jQuery Kendoka image

The MultiSelect is part of Kendo UI for jQuery, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Initializing the MultiSelect

To initialize the MultiSelect, use the <option> tag of an existing <select> element with defined data items.

You can also initialize the MultiSelect through binding it to local or remote data and then using the <select> element. For more information, refer to the article on data binding.

Regardless of the applied initialization, the performance and functionality of the MultiSelect are consistent. For a complete example, refer to the demo on the basic usage of the MultiSelect.

  • When you initialize the MultiSelect, create it within a $(document).ready() statement because the widget has to be initialized after the DOM is fully loaded.
  • The MultiSelect copies any styles and CSS classes from the input element to the wrapper element and visible input.

The following example demonstrates how to initialize the MultiSelect from an existing <select> element with defined data items.

<select id="multiselect">
    <option>Item 1</option>
    <option>Item 2</option>
    <option>Item 3</option>


Functionality and Features


For a complete example on the basic MultiSelect events, refer to the demo on using the events of the MultiSelect.

See Also

In this article