[Autocomplete] Provide options to control behaviour when cleared
See original GitHub issue- I have searched the issues of this repository and believe that this is not a duplicate.
Summary 💡
While this issue is similar to #18280 I don’t believe its a duplicate.
It would be good if developers had the ability to customize the behavior of the autocomplete when the selection is cleared via the Clear button.
Options:
openOnClear={false}
- revert the Autocomplete to it’s null/placeholder stateonClear
event handler
Examples 🌈
<Autocomplete
options={["A", "B", "C", "D"]}
openOnClear={false}
renderInput={params => (
<TextField {...params} label="Letter" variant="outlined" fullWidth />
)}
/>
Issue Analytics
- State:
- Created 4 years ago
- Reactions:4
- Comments:9 (7 by maintainers)
Top Results From Across the Web
[Autocomplete] Provide options to control behaviour when ...
What about a solution like this one: [Autocomplete] Improve popup open logic #18815 (comment)? Basically, we could give a reason argument to the ......
Read more >How to customize clear behaviour of Material-UI ...
I have a controlled Autocomplete component bound to a state prop from redux, that's all working. The onChange event is fired when the...
Read more >Controlling behavior with State | Autocomplete
State changes occur automatically when a user interacts with the autocomplete (updates the input text, selects an item, etc.). You can react to ......
Read more >How to turn off form autocompletion - Web security | MDN
This article explains how a website can disable autocomplete for form fields.
Read more >Autocomplete API - Material UI
Name Type Default
options * array
renderInput * func
autoComplete bool false
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@MartinSkovsen Thanks for the extra details, feel free to override this behavior in your application. I assume you would need to call prevent default on mouse down to keep the focus where it was, and extend the component to support https://next.material-ui.com/components/autocomplete/#events.
Good point. I don’t have any specific expectation for the activeElement; Keeping the current functionality is certainly a sensible default. However, I would like to optionally provide an alternative activeElement. Think of this scenario:
I have an optional entry in my form. The user uses a combobox for providing the desired value. The user might decide to delete the selected value for which ever reason, and then want to be out of focus. I currently have this case, and ideally I don’t interfere with how the component works, particularly since a work around will be devious (and surely confusing). – Perhaps this is just an anti pattern suggestion…