Open AutoComplete dropdown on entering the control

[Pieter]

Hi,

Is it possible to open the "dropdown" for the AutoComplete component by default when entering the contol (giving it focus/clicking on it)?

So for example: in the samples of the Getting started of the AutoComplete (https://www.telerik.com/kendo-react-ui/components/dropdowns/autocomplete/) that you just click on the control and that it shows all countries instead of only showing those after you start typing?

Regards,

Pieter

[Stefan]

Hello, Pieter,

This can be done by updating the component internal state, during the onFocus event:

https://www.telerik.com/kendo-react-ui/components/dropdowns/api/AutoCompleteProps/#toc-onfocus

I made an example showcasing this:

https://stackblitz.com/edit/react-ad8mdw?file=app/main.jsx

Regards,
Stefan
Progress Telerik

[Pieter]

Thanks for the example, this works when the control doesn't have the focus yet, but how do I solve this when the control already has the focus (in your example: click on the control and hit escape)?

[Stefan]

If the requirement is to open it each time the user clicks on in:

- get the component ref

- wrap the component in a span element and open it during the onClick of the span.

I updated the example:

https://stackblitz.com/edit/react-ad8mdw-gvivk9?file=app/main.jsx