moroshko / react-autosuggest

WAI-ARIA compliant React autosuggest component
http://react-autosuggest.js.org
MIT License
5.97k stars 587 forks source link

stopPropagation() causes autosuggest doesn't close the dropdown #663

Open ghost opened 5 years ago

ghost commented 5 years ago

I have a button inside the suggestion as follows: alt text

When I click on the right side button (close icon) I have to use e.stopPropagation() to prevent clicking on the suggestion itself and then remove that suggestion. After removing the item I can't close the dropdown anymore when click outside of the dropdown.

ronaklalwaniii commented 5 years ago

I have exactly the same issue. Any ideas on how to fix it?

ghost commented 5 years ago

I managed it like this: I removed e. stopPropagation() so now when we click on the close button two different functions are being called in this order: 1- onRemoveClick 2- onSuggestionSelected. When I click on remove button I set a flag true and then inside onSuggestionSelected I'm checking that flag and if that is not true I will go through the functionality, otherwise it does nothing.

gilad-solter commented 5 years ago

@sepehra1313 Can you explain what do you mean by: otherwise it does nothing.. How do you prevent the dropdown from closing without e.stopPropagation()?

Zacele commented 2 months ago

I managed it like this: I removed e. stopPropagation() so now when we click on the close button two different functions are being called in this order: 1- onRemoveClick 2- onSuggestionSelected. When I click on remove button I set a flag true and then inside onSuggestionSelected I'm checking that flag and if that is not true I will go through the functionality, otherwise it does nothing.

Still now working as expected since onRemoveClick would still close the suggestion list immediately after fired, I would like to keep the suggestion list open while interacting with its childs.