New to KendoReact? Start a free 30-day trial

Common Scenarios

You can use the configuration options of the DropDownList to achieve the implementation of common scenarios.

Controlling the DropDownList Value

You can use the DropDownList as the so-called "controlled component" in React which is similar to the behavior of the native <select> element.

Example
View Source
Edit In Stackblitz  
Change Theme:

Implementing Cascading DropDownLists

The cascading DropDownList is a series of two or more DropDownLists where each DropDownList is filtered based on the selected option from the previous DropDownList.

Example
View Source
Edit In Stackblitz  
Change Theme:

Using Data Fields for Values

The following example demonstrates how to implement a Higher-Order Component and allow the use of a DropDownList data field for a value.

Example
View Source
Edit In Stackblitz  
Change Theme: