sickdyd/react-search-autocomplete

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

Closed this issue · 3 comments

sleepybjr commented

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

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

sleepybjr commented

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

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