Saturday, November 1

How To Select First Option using jQuery AutoComplete

When we have a list of values and want to select one of them, we chose DropdownBox or jQuery AutoComplete for listing the element in HMTL. The modern approach to show this kind of listing is one of the most user friendly jQury Auto Complete.

When we integrate jQuery AutoComplete with minimal options it gives us facility to select any option from the list as we type in inputbox.


Here is the simplest code if we want to get this work with our input-box:
$( "#tags" ).autocomplete({
      source: availableTags
    });

Now if we want the first list item to be selected by default when we type in some letters, here is what to do. We just have to trigger 'select' event of the Auto Complete and we are done.
$( "#tags" ).autocomplete({
      source: availableTags
    })._trigger('select');
And here is what we get as we type 'P' in Input Box

Happy coding :)
Post a Comment