- This package is а part of KendoReact—a commercial UI library.
- You will need to install a license key when adding the package to your project. For more information, please refer to the KendoReact My License page.
- To receive a license key, you need to either purchase a license or register for a free trial. Doing so indicates that you accept the KendoReact License Agreement.
- The 30-day free trial gives you access to all the KendoReact components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the KendoReact dev team!
Start using KendoReact and speed up your development process!
The React DropDowns, part of KendoReact, offer a highly customizable interface for users to select different items from a list, search in large lists, and more. All KendoReact DropDowns are following the best accessibility standards.
What's in this package (ToC):
- React AutoComplete component
- React ComboBox component
- React MultiColumnComboBox component
- React DropDown List component
- React DropDownTree component
- React MultiSelect component
- React MultiSelectTree component
- React DropDowns Components Library Features
- Support Options
The KendoReact AutoComplete component is part of KendoReact and lets your end-users type text into an input element and a list of suggested items will appear in a popup beneath. With suggestions turned on, the React AutoComplete will fill in the input field with suggestions from the underlying data, saving the user a lot of time when selecting data in the AutoComplete.
The KendoReact ComboBox component is part of KendoReact and is a form component designed to let end users choose a predefined value from a list, and often is used as a much richer version of the select HTML element. Initially popularized by Material Design, Floating Labels have become so popular that almost any input can take advantage of their sleek look and feel. With the suggestion feature enabled, the KendoReact ComboBox will attempt to autofill the input element based on the closest available value.
The KendoReact MultiColumnComboBox component provides a dropdown component that displays information about items in multiple fields arranged in columns. The KendoReact MultiColumn ComboBox comes with filtering, grouping, virtualization and more handy features. When handling larger sets of data, it is very helpful to organize information in categories. With grouping enabled, the React MultiColumn ComboBox can group all data items by a particular field.
The KendoReact DropDownList component is a form component that enables end users to choose a single predefined value from a list, without support for typing in values, and is a richer form of the select element. The KendoReact DropDownList can be bound to various forms of data, including datasets of objects, an array of primitive values or binding directly to a single value property. Additionally, the React DropDown List can bind separate fields to the displayed text and the underlying value. By Default, the KendoReact DropDownList will render an empty area if no value has been displayed. Some requirements may call for some sort of placeholder string indicating what the DropDownList component is for, which is where the default item feature comes in.
A combination of a TreeView and a DropDown component, the KendoReact DropDownTree component is perfect for forms that need to display complex data concisely. When users interact with this simple input element, the dropdown opens up to reveal a built-in TreeView with a hierarchical structure.
The KendoReact MultiSelect component is a form component that displays a list of options in a popup and allows for multiple items to be selected from this list. Each selected item is rendered as a tag in the input element. With the custom tags feature, the MultiSelect can customize what to display when an item is selected, including having a single tag representing all selected items.
The KendoReact MultiSelectTree component is a form component that lets you choose multiple predefined values from a hierarchical list and is a richer version of the
select element. The component supports filtering, custom rendering, keyboard navigation, expand and collapse of the
hierarchical data items.
Among the many features which the KendoReact DropDowns deliver are:
- Controlled state—Control the value and popup state of the DropDowns.
- Filtering—Filter the data of the DropDowns to easily find any value in a large dataset.
- Disabled state—To disable user input or selection, just change a single property.
- Virtualization support—The virtualization helps when displaying large sets of data.
- Custom rendering—You can replace the value and the popup list item renders with custom ones.
- Setting the default value—Easily configure the initial value that the DropDowns render.
- Form validation—Validate the values, set validation requirements, and prevent the submission of forms which are in invalid state.
- Accessibility support—The DropDowns are compliant with WAI-ARIA, Section 508, and provide keyboard navigation.
- Theme support—The KendoReact DropDowns, as well as all 100+ components in the KendoReact suite, are styled in three polished themes (Bootstrap, Material, and Default) and can be further customized to match your specific design guidelines.
For any issues you might encounter while working with the KendoReact DropDowns, use any of the available support channels:
- Industry-leading technical support—KendoReact paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use the dedicated KendoReact support system.
- Product forums—The KendoReact forums are part of the free support you can get from the community and from the KendoReact team.
- Feedback portal—The KendoReact feedback portal is where you can request and vote for new features to be added.
- Getting Started with KendoReact
- Getting Started with the KendoReact DropDowns
- API Reference of the KendoReact DropDowns
- KendoReact Roadmap
- Demos, documentation, and component reference
- KendoReact pricing and licensing
High-level component overview pages
- React AutoComplete Component
- React ComboBox Component
- React DropDownList Component
- React DropDownTree Component
- React MultiColumn ComboBox Component
- React MultiSelect Component
- React MultiSelectTree Component
Copyright © 2023 Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved.
Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries.