Is there onSelect event for the Autocomplete component?

[Randy]

We are using the auto complete component that does a fetch for server side data based on the users entered text. We need to take action once they select an item from the list.

I don't see an onSelected event for the Autocomplete box. We did see it on (I believe) the combo box. Image of event attached.

We tried the combo box but didn't get the functionality we were looking for with the typeahead search.

The closest thing I found to working around the issue was to use itemRender and attach the click event to the div, but this is more of a hack as you can click just outside the div and still select what you want without firing the onclick.

 

const itemChildren = (

            //TODO, How can I add the onclick to the LI instead of this div.

            <div onClick={onClickPatientSelect} style={{ width: "100%", backgroundColor: "lightseagreen" }}>

                { li.props.children}

            </div>

        );

        return React.cloneElement(li, li.props, itemChildren);

 

 

Here is the current autocomplete code

<AutoComplete

            data={searchPatientData}

            value={searchText}

            onChange={onChange}

            textField="SearchDisplay"

            placeholder="Search for a patient"

            loading={loading}

            itemRender={itemRender}

        />

[Terry]

When the user clicks an entry in the Autocomplete component it fires the onChange event. I think that's what you are looking for.

[Terry]

This gives a decent example https://www.telerik.com/kendo-react-ui/components/dropdowns/autocomplete/binding/

[Stefan]

Hello, Randy,

This can be done indeed on the onChange event as Terry suggested.

The specific part is that the onChange will be fired when the user types as well, but we can differentiate it by checking for the event type:

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

Also, the ComboBox has a suggest option that provides similar type-ahead functionality:
https://www.telerik.com/kendo-react-ui/components/dropdowns/combobox/suggestions/

Regards,
Stefan
Progress Telerik