Jquery-ui autocomplete selecting single answer

Question

I want jquery-ui autocomplete to automatically select an answer if only one answer is returned.

Answer 1

I set autocomplete with an "open" callback:

jQuery('#people_new_user input[type="text"]').each( function(index, element) { var field = element.name; jQuery(element) .autocomplete({ source: "/cf/AutoComplete/People?current="+field, open: openUser }); }); 

And in the open callback, I look to see if there is only one result and select it if it is:

 function openUser(event, ui) { // Try to select the first one if it the only one var $children = jQuery(this).data('autocomplete').menu.element.children(); if ($children.size() == 1) { $children.children('a').mouseenter().click(); } } 

Answer 2

Thanks so much for this, it works well for us. In case this helps someone, I am having problems with its first use in IE10. It always worked great in IE8, Chrome, and Firefox.

In IE10, it failed on jQuery(this).data('autocomplete').menu.element.children() with: Member not found

It turned out simply because the web page had: <meta http-equiv="X-UA-Compatible" content="IE=7"/> Removing this problem fixed the problem (and it still works fine in IE8).

But before I noticed this, I spent a lot of time trying to move to jquery-1.11.1.min.js (since 1.6.4) and jquery-ui-1.11.0 (from 1.8.16).