KendoReact ComboBox Overview
The KendoReact ComboBox is a form component that lets you choose a single predefined value from a list and is a richer version of the
<select> element and supports filtering, virtualization, and entering of custom values.
The KendoReact ComboBox component is part of the KendoReact library of React UI components. It is distributed through NPM under the kendo-react-dropdowns package.
The following example demonstrates the ComboBox in action.
The ComboBox is part of the KendoReact Dropdowns component library. The procedures for installing, importing, and using the Dropdowns are identical for all components in the package. To learn how to use the ComboBox and the rest of the Dropdowns, see the Getting Started with the KendoReact Dropdowns guide.
- Data and value binding—You can bind the ComboBox to primitive (strings and numbers) or complex (objects) items.
- Custom values—You can allow the ComboBox component to accept custom values.
- Filtering—You can configure the ComboBox to filter the results locally or on the server.
- Grouping—You can display grouped data with visual labels for each group.
- Suggestions—To turn the suggestions on, set the
- Custom rendering—You can customize the way the ComboBox component renders its elements.
- Virtualization—The virtual scrolling feature is an alternative to paging and helps display large data sets.
- Floating labels—You can show floating labels inside the KendoReact ComboBox component.
- Forms support—You can use the React ComboBox component with HTML form elements or with the KendoReact Form component.
- Globalization—The built-in globalization support allows you to create apps that are ready to be implemented worldwide.
- Keyboard navigation—The ComboBox supports various keyboard shortcuts.
- Accessibility—The ComboBox is accessible for screen readers and supports WAI-ARIA attributes.
To learn more about the appearance, anatomy, and accessibility of the ComboBox, visit the Progress Design System documentation—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.