Using <form> onSubmit and trying to clear input leaves search box open

sickdyd / react-search-autocomplete

A search box that filters the provided array of objects

https://sickdyd.github.io/react-search-autocomplete

MIT License

218 stars 82 forks source link

Using <form> onSubmit and trying to clear input leaves search box open #58

Closed sleepybjr closed 2 years ago

sleepybjr commented 2 years ago

I wanted to use the form and use Enter to save information as well as clicking, then clear the input for the user to enter more information. I referenced #23 and #38 to do this. However, the dropdown search box remains open. Is there a workaround to trigger the OnBlur event or empty the Results array so the box will clear when you set the input using setState?

See below for example: https://codesandbox.io/s/nifty-morning-1zpn2e?file=/src/App.js

sickdyd commented 2 years ago

@sleepybjr Could you tell me the steps to reproduce, please?

sleepybjr commented 2 years ago

In the environment I linked,

1) Type "J". 2) Hit "enter". Suggestion box will show up with "JavaScript" and "Java". 3) "J" will be cleared but suggestion box remains.

Using setState will clear the text field, but it won't remove the suggestion box unless the user clicks somewhere to get onBlur called or types to get onChange called.

sickdyd commented 2 years ago

@sleepybjr You are using a fairly old version (5.2.2), I could not see the issue with the latest one (6.1.2).