Autocomplete disabled after setting focus in onChange

1

I’m using an F7 Autocomplete for users to enter tags by searching. The desired use case is to enter multiple tags, so I’m resetting focus to the input in the onChange event.

However, the search results dropdown doesn’t display for new searches after I reset focus to the input via javascript. In order to get the dropdown results to display again on new searches, I have to click outside the input and click in again…which defeats the purpose of setting focus back to the input.

Here’s my onChange event:

on: {
  change: function (results) {
    // clear the input
    this.inputEl.value="";
    // handle the result
    var result = results[0];;
    post.tags.push(result);
    //reset focus
    this.inputEl.focus();  // the cursor goes to the input, but search is not active
  }
},

Is there some other way to reset focus that will allow the autocomplete to stay functional?

UPDATE

I can see from console.log that queries are still being sent and results returned to the render function. The problem is that the results dropdown isn’t displaying.

2

here => quizzical-sid-tsgxbi

3

@deejay I don’t see you setting .focus() back to the input on result select. Am I missing something?

UPDATE

Now I see it…seems to be a 150ms timeout is necessary? I’ll give that a try.

4

edit => quizzical-sid-tsgxbi
0 timeout will do it.