Always Show A Specific Choice In JQuery Autocomplete Even If It Doesn't Match Input

I have a jQuery autocomplete (jquery ui version 1.8) in which I type a name. When available, I want the user to select a name from the list as these are owner names from our datab

Solution 1:

I think Autocomplete builds the collection of objects retrieved into an unordered list. like ->

<ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all">
  <li class="ui-menu-item">
    <a class="ui-corner-all">item 1</a>
  </li>
  <li class="ui-menu-item">
    <a class="ui-corner-all">item 2</a>
  </li>
  <li class="ui-menu-item">
    <a class="ui-corner-all">item 3</a>
  </li>
</ul> 

It also has a method to detect when the list is opened with the open event.

$('selector').autocomplete({
  open: function(){
    $('.ui-autocomplete').prepend('<li class="ui-menu-item"><a class="ui-corner-all ui-add-new"> Add New </a></li>');
  }
});

You can see that we've added a list item to the auto-complete dropdown menu when it opens, so that you always get 'Add New' at the top of the list (jQuery's .prepend() handles that).