Question

I'm using the jquery autocomplete UI widget, for example:

var names = ["John", "Jack", "Nick", "Tom", "Joyce", "Nancy"];
$("#nameInput").autocomplete({
    source: names
});

I'd like it to behave like the Gmail's "To" textbox.

Specifically, I'd like it to highlight the best match as you type and if you press enter, then the highlighted value gets selected.

In other words, I don't want to have to use the up/down arrows or the mouse to make the selection.

Thanks for any suggestions!

Was it helpful?

Solution

Since autocomplete filters result while you type, you just need to hightlight the first result automatically.

//PSEUDO CODE
$('input').autocomplete({
  source: //your code to link to the source,
  open: //your code to select the first element, I cannot see there is a built-in method to select the first option, but you could firebug the menu and use css class to target the correct element.
});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top