CODEWITHSUNDEEP
jqueryjquery-uiautocompletejquery-autocompletejquery-ui-autocomplete
Fiona - myaccessible.website
Fiona - myaccessible.website

Reputation: 14921

How do I get jQuery UI autocomplete multiple to remove items that have already been selected

The jQuery UI autocomplete multiple example provided here allows you to add the same item more than once.

How do I prevent this from happening?

Upvotes: 3

Views: 3359

Answers (1)

Fiona - myaccessible.website
Fiona - myaccessible.website

Reputation: 14921

If you take the example provided by jQuery UI here, add the following line within the select function of the autocomplete:

availableTags.splice($.inArray(ui.item.value, availableTags), 1);

This basically removes the item that has just been selected from the list of available tags.

The select function you end up with should look like this:

select: function( event, ui ) {
    var terms = split( this.value );
    // remove the current input
    terms.pop();
    // add the selected item
    terms.push( ui.item.value );
    // add placeholder to get the comma-and-space at the end
    terms.push( "" );
    this.value = terms.join( ", " );
    // remove added item from list of available items to select
    availableTags.splice($.inArray(ui.item.value, availableTags), 1);
    return false;
}

Upvotes: 5

Related Questions