Question

Problem: I have to color my results in the little dropdown based on their value.

Solution: Use the ‘open’ event hook to loop through options and assign a color.

Problem: So the documentation for the jQuery UI autocomplete says that the open event hook receives two arguments- ‘ui’ and ‘event’. The problem is, ‘ui’ is just an empty object (someone filed a bug report about this, and the brilliant jQuery UI team said it’s not a problem), and ‘event’ only has the input box, not the dropdown that’s generated. At this point, the only way I can select my options list from here is to do this:

$( event.target ).nextUntil("ul.ui-autocomplete").last().next()

That’s gross. Please tell me there’s a better way?

PS: If anyone says “Just use $(‘ul.ui-autocomplete’)!” you’ve obviously never worked on anything more complicated than…. something that’s not complicated.

Answer 1

The official documentation is terrible, but after lots of exploring I figured it out:

$(event.target).data('autocomplete').menu.element