I have been trying to get an autocomplete component to save the state when a user types and clicks an item from the autocomplete list. I'm trying to filter my table using this state. Currently my table is filtering as data is typed into the text field but not when an item is clicked.
Here is my Autocomplete and TextField:
Here is my Table:
Here is my interface:
Any help would be great guys, thanks
You should move your onChange event from the textarea to the Autocomplete itself. Having it filter as you are typing is probably not the best idea as it will be happening as you type but you probably want it to happen when you actually select an option.
Having the autoSelect property will also help with if you type the name of the country without selecting it.
<Autocomplete
onChange={(event, newValue) => {
setSearchTerm(newValue)
}}
autoSelect
/>
