Skip to main content

Search and Top Navigation

#8832 closed bug (notabug)

Opened November 19, 2012 10:53PM UTC

Closed November 19, 2012 10:56PM UTC

Last modified November 20, 2012 07:39AM UTC

jQuery UI autocomplete bug: autocomplete suggestions disappear when returning from another browser tab

Reported by: Syryos Owned by:
Priority: minor Milestone: 1.10.0
Component: ui.autocomplete Version: 1.9.1
Keywords: Cc:
Blocked by: Blocking:
Description

jQuery UI autocomplete bug: autocomplete suggestions disappear when returning from another browser tab

I run an application with a working jQuery UI autocomplete form in a first tab. I do know how to use the autocomplete function. I also do know how to use $("myinput").autocomplete( "search", currentInput ); to manually trigger the list of suggestions to be shown.

Scenario - how to replicate the bug

=

An input "jav" is - for example - extended by two suggestions in the list of suggestions below the input like "java" and "javascript".

In my Firefox browser, I now change to a second tab with a different web address.

Autocomplete bug

=

When I return to the first browser tab, the input "jav" is still present, but the list of suggestions has disappeared, there is no output any more.

For me, this is a severe bug in autocomplete. Why should the autocomplete output disappear only because the user switches back to this browser tab?

I have written autocomplete javascripts since a long time ago, but jquery-ui autocomplete appears to behave differently. Please fix this bug.

Attachments (0)
Change History (9)

Changed November 19, 2012 10:56PM UTC by scottgonzalez comment:1

resolution: → notabug
status: newclosed
Why should the autocomplete output disappear only because the user switches back to this browser tab?

Because the field is blurred.

Changed November 19, 2012 11:00PM UTC by Syryos comment:2

_comment0: hehe, this is unusual GUI. \ \ How can this (suggestions disappear when coming back to that tab) be avoided? \ \ 1353366061282346

hehe, this is unusual GUI.

How can this (suggestions disappear when coming back to that tab) be avoided?

Please supply a solution, instead of simply closing this bug.

Changed November 19, 2012 11:01PM UTC by scottgonzalez comment:3

Run a new search using page visibility APIs? You'll need to ask for help on the forums or StackOverflow.

Changed November 19, 2012 11:36PM UTC by Syryos comment:5

_comment0: Solution: \ \ When my page (the container div of my query form with the input line) regains the focus - for example, because the user switched back from another browser tab - I fire the autocomplete search (bound to the #input) simply again. \ \ This solved my problem. \ \ $("#container).live( "focusin", function(event) { \ $("#input").autocomplete( "search", currentInput ); \ }) \ 1353373181883683

Solution:

When my page (the container div of my query form with the input line) regains the focus - for example, because the user switched back from another browser tab - I fire the autocomplete search (bound to the #input) simply again.

This solved my problem.

$("#container).live( "focusin", function(event) {

$("#input").autocomplete( "search", $("#input").val() );

})

Changed November 20, 2012 12:33AM UTC by scottgonzalez comment:6

That sounds like a bad idea, you don't want to trigger a search on every focus. But this is out of scope, so I'll stop responding here.

Changed November 20, 2012 12:58AM UTC by Syryos comment:7

Replying to [comment:6 scott.gonzalez]:

That sounds like a bad idea, you don't want to trigger a search on every focus. But this is out of scope, so I'll stop responding here.

You are simply wrong. The lines of code are exactly what is needed as solution, and fire only a _single_ search when returning from another tab or otherwise returning to that page. And this is needed to "refresh" and show the suggestions for the (still present) $("#input).val()

This can be easily proved: add a console.log message after the $("#input").autocomplete( "search", $("#input").val() ); statement.

Changed November 20, 2012 01:04AM UTC by scottgonzalez comment:8

Except that, as I said, every single time you focus the field, you'll run a search. Go ahead, try it. Type something, wait for results to show up. Tab away from the field, watch the results disappear. Shift+tab back to the field, watch the search run again.

Changed November 20, 2012 07:39AM UTC by Syryos comment:9

In addition

I tried to follow your thoughts to avoid unnecessary "searches" and experimented with using a mechanism which only re-activates the visibility of the suggestion list div.

I compared my original method 1

$("#container).live( "focusin", function(event) {
    $("#input").autocomplete( "search", $("#input").val() );
})

with a new method 2

$("#container).live( "focusin", function(event) {
   $("#ui-id-1").show();
}) 

The second method does not work in all cases. For example. when you navigate away from the page A with jquery-ui autocomplete by clicking on a link which is present on the page, and then use browser back to your page A, the ui-autocomplete ui-menu div $("#ui-id-1") is shown, but empty,

Therefore it makes sense to use the first method, which fires a new search and always ensures that the suggestions are shown. if the input is not empty.