ComboBox Overview

The ComboBox displays a list of values and allows for a single selection from the list.

The widget enables the user to enter custom values through the keyboard and represents a richer version of the <select> element.

• Demo page for the ComboBox

Initializing the ComboBox

To initialize the ComboBox, use any of the following approaches:

• Bind the widget to a local data array and use the <option> tag of an existing <select> element with defined data items.
• Bind the widget to a local data array and use the <input> element.
• Bind the widget to a remote data service and use the <input> element.

When you initialize the ComboBox, note the following specifics:

• Create the ComboBox within a $(document).ready() statement because the widget has to be initialized after the DOM fully loads.
• The ComboBox copies the styles and CSS classes from the input element to the wrapper element.

Functionality and Features

• Data binding
• Grouping
• Server filtering
• Templates
• Virtualization
• Appearance
• Cascading ComboBoxes

Referencing Existing Instances

To refer an existing ComboBox widget, use the jQuery.data() configuration option.

<input id="comboBox" />

<script>
    var comboBox = $("#comboBox").data("kendoComboBox");
</script>

See Also

• Basic Usage of the ComboBox (Demo)
• Using the API of the ComboBox (Demo)
• JavaScript API Reference of the ComboBox