Question

I have multiple autocomplete inputs on my page. Behind the scenes, each autocomplete list is a separate hidden ul element (ul.ui-autocomplete), but I cannot figure out how they are linked to the input.

I am trying to use the scrollTo plugin to scroll to the li.ui-state-hover element so that the current selection is visible. This works fine, except for when you switch between inputs. Selecting ul.ui-autocomplete is not sufficient, because I don’t know which one I am getting.

Answer 1

I found a solution.

If you set up the combobox as described in the jQueryUI comobobox example, there is an input variable in the _create function:

var input = this.input = $( "<input>" )
            .insertAfter( select )
            .val( value )
            ...

You can access the ul element by calling .data() on that input variable:

var $ul = input.data('autocomplete').menu.element;