jquery autocomplete: several elements selected, how to not showing the selected elements in the drop-down menu?

I have implemented a jquery autocomplete input that shows an drop-down list.

I'm using that field to choose several elements, so when I select an element and press enter the input is emptied and I can select another one.

My doubt: what can I do to not showing in the drop-down list the elements that has been selected?

This is my js code:

  jQuery("#user_autocomplete")
开发者_如何转开发  .autocomplete('autocompleteUser', jQuery.extend({}, {
    dataType: 'json',
    parse: function(data) {

      var parsed = [];
      for (key in data) {

    parsed[parsed.length] = { data: [ data[key], key ], value: data[key], result: data[key] };
      }

      return parsed;

      }
  } ))
  .result(function(event, data) {
   $('#field_users').append('<div class="user_choosen" id=' + data[1] + '>' + data[0] +'<a class="link_delete_user" href="#" onclick="javascript:deleteUser(' + data[1] +')">Delete</a></div>'); 
    $('#user_autocomplete').val(''); 

  });

Regards

Javi

---

My recommendation would be to edit the source attribute of the autocomplete. After you have performed your fetch and received your JSON data, remove the elements that are already in the div.user_chosen. You can edit the options of the autocomplete at any time. You'll want to edit the source option.

---

In your parse function, filter out those already-selected elements and do not add them into the parsed[] array.