IOS keyboard does not close on selecting a value in a search selection dropdown

jwilliams-ecometrica commented 5 years ago

Bug Report

Steps

Go to the Search selection example on the semantic react website using an ios device and select an option.

Expected Result

The keyboard should close when an item is selected.

Actual Result

The keyboard remained open.

Version

0.87.3

Testcase

https://react.semantic-ui.com/modules/dropdown/#types-search-selection

welcome[bot] commented 5 years ago

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you've completed all the fields in the issue template so we can best help.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

ivankenou commented 3 years ago

i will do this issue

deniapps commented 1 year ago

I faced a similar issue and have been searching for a solution for some time now. The problem was that even after selecting a value from a search selection, the input remained focused. I attempted to fix this issue using document.activeElement.blur();or document.querySelector(".ui.dropdown.search input").blur();, but it did not work. Eventually, I discovered a solution by programmatically focusing and then blurring the input (it is crucial to set a timeout to ensure that the blur works properly). The code looks like this:

const handleChange = (e, { value }) => {
    setValue(value);
    try {
        document.querySelector(".ui.dropdown.search input").focus();
        setTimeout(() => {
            document.querySelector(".ui.dropdown.search input").blur();
        }, 500);
    } 
    catch (error) {
        console.log("close keyboard error", error);
    }
 };

You can see how the issue was resolved at this link: https://swimstandards.com/rankings

Semantic-Org / Semantic-UI-React