React ComboBox

  • This customizable React ComboBox offers built-in filtering, suggestions and virtualization, plus accessibility and forms support.
  • Part of the KendoReact library along with 100+ professional UI components built with React for React, from the ground up.
  • Get started quickly with our award-winning support, detailed documentation, interactive demos and instructor-led training.
  • Overview

    The React ComboBox component, part of KendoReact, 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. The component naturally highlights the dropdown that the values appear in a dropdown arrow next to the text input, and the component sports a whole slew of features to make picking the proper value as easy as possible.

    See React ComboBox Overview demo

    React ComboBox – Overview, KendoReact UI Library
  • Filtering

    The built-in filtering mechanism of the KendoReact ComboBox automatically reduces the number of available choices in the ComboBox dropdown. Filtering can be configured in various ways, including "starts with" or "contains" to ensure the most intuitive filtering behavior for any scenario.

    See React ComboBox Filtering demo

    React ComboBox – Filtering, KendoReact UI Library
  • Suggestions

    With the suggestion feature enabled, the KendoReact ComboBox will attempt to autofill the input element based on the closest available value. This suggestion will continue to update as the user types.

    See React ComboBox Suggestions demo

    React ComboBox – Suggestions, KendoReact UI Library
  • Custom Rendering

    By default, the KendoReact ComboBox renders items with plain text. Certain scenarios call for more advanced rendering and this is where the custom rendering feature of the React ComboBox shines! This allows a custom renderer to be injected for any list item, header or footer element, as well as the suggestion lists when no data is available—enabling developers to take full control over the look and feel of the ComboBox component.

    See React ComboBox Custom Rendering demo

    React ComboBox – Custom Rendering, KendoReact UI Library
  • Virtualization

    Depending on your requirements the React ComboBox may be bound to thousands or hundreds of thousands of data items, which can be quite taxing on any modern browser to render. Thanks to the built-in virtualization feature of the KendoReact ComboBox, scrolling through large amounts of data is done with buttery-smooth performance.

    See React ComboBox Virtualization demo

    React ComboBox – Virtualization, KendoReact UI Library
  • Floating Labels

    Popularized by Material Design, the floating label starts off as a placeholder in an input element only to animate out and float above the input and act as a label. The KendoReact AutoComplete component comes with support for floating labels built-in, no matter what design language you chose to incorporate it with.

    See React AutoComplete Floating Labels demo

    React AutoComplete - Floating Labels, KendoReact UI Library
  • Forms Support

    The KendoReact ComboBox is most often used as a part of a form to help the user select from a longer list of data. In this vein, the React ComboBox supports being added to any plain form element or integrated into an existing React Form library (including the Form component from KendoReact). Thanks to built-in styling and behavior around validation, this UI component can fit with any form.

    See React ComboBox Forms Support demo

    React ComboBox – Forms Support, KendoReact UI Library
  • Keyboard Navigation

    Keyboard navigation has become a crucial part of website navigation for several reasons ranging from speed of data input to accessibility concerns. Thankfully, this React ComboBox comes with built-in keyboard navigation to help navigate through every part of the component and assist with selecting a value with ease.

    See React ComboBox Keyboard Navigation demo

  • Accessibility

    Creating accessible React UI components is a core concept of KendoReact, and the ComboBox is no exception! The KendoReact ComboBox is compliant with Section 508 standards, is AA rated with WCAG 2.0, and follows WAI-ARIA standards.

    See React ComboBox Accessibility demo

    React Accessibility - KendoReact

All KendoReact Components

waves bg

Next Steps

Visit Our Demos

See KendoReact in action and check out how much it can do out-of-the-box.

See Pricing

Buy an individual license for KendoReact, or treat yourself to Kendo UI, our complete JavaScript bundle.

Start Free Trial

Try KendoReact with dedicated technical support.