Jquery UI Autocomplete - accessing combobox list
I'm working with jquery ui autocomplete to make autocomplete selects. My basis was
http://jqueryui.com/autocomplete/#combobox
There's one specific thing I've been trying to accomplish now for a couple days and I haven't been able to. I would like to bind the enter key so a user could simply hit enter while typing and it will select the first element in the list. Right now they have to either mouse over the option to hit enter or key down. (this means a keyboard only user would have to do more work on this than on a normal select to get their value)
I can do what I want to just fine when there's one combobox on the page, but I can't find a way to UNIQUELY identify the ul lists of autocomplete values for when there's more than one combobox.
$("ul.ui-autocomplete li:first").text() gives me what I want the first time, but every single list of combobox values has the same classes and look like this:
<ul tabIndex="0" class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" id="ui-id-1" style="display: none; z-index: 1;"/>
So when it gets called for a second or third time on a different combobox,
$("ul.ui-autocomplete li:first").text() is only giving me the first option of the first combobox, which is clearly not what I want.
Is there a way to do this? I really just need a way to uniquely identify that ul component (that ID just has a number and doesn't tell me which actual value it is, and my page has comboboxes that show and hide dynamically so I can't make a mapping of the ID's that are autogenerated to the order of the comboboxes)