optionLabelString | Object(default: "")
Define the text of the default empty item. If the value is an object, then the widget will use it as a valid data item. Note that the optionLabel will not be available if the widget is empty.
- If
optionLabelis an object, it needs to have at leastdataValueFieldanddataTextFieldproperties. Otherwise, widget will showundefined.
Note that the very same optionLabel object will be passed to the valueTemplate. You need to ensure that all required by the valueTemplate properties are present in the optionLabel object.
- Since Q1 2015 (2015.1.318), the option label is rendered as a separate header template. The benefits of this change are:
- the widget's value will be empty string even when
dataValueFieldanddataTextFieldoptions are equal or not defined - the widget will not throw an exception when a custom item template is used and
optionLabelis string - option label has a separate template, that gives more freedom for customization
- [Not relevant after Q1 2015] Widget's value will be equal to the
optionLabelif thedataValueFieldanddataTextFieldoptions are equal or not defined
Example - specify optionLabel as a string
<input id="dropdownlist" />
<script>
$("#dropdownlist").kendoDropDownList({
dataSource: ["Apples", "Oranges"],
optionLabel: "Select a fruit..."
});
</script>
Example - specify optionLabel as an object
<input id="dropdownlist" />
<script>
$("#dropdownlist").kendoDropDownList({
dataSource: [
{ productName: "Product 1", productId: 1 },
{ productName: "Product 2", productId: 2 }
],
dataTextField: "productName",
dataValueField: "productId",
optionLabel: {
productName: "Select a product...",
productId: ""
}
});
</script>
In this article