CODEWITHSUNDEEP
javascriptjqueryautocompletejquery-ui-autocomplete
user3271680
user3271680

Reputation: 1

Selecting multiple values in autocomplete on focus

I have implemented Autocomplete using jQuery UI for multiple values. It works fine but the issue is I do not want to to explicitly select the value from the drop down(using a tab). My requirement is as and when, I navigate through the drop down, my search box should get populated. and then I enter a coma and continue my search from the drop down again.

I basically tried the piece of code that is there in jqueryUI Autocomplete but in that the focus has been suppressed. What I want is that instead of selecting the item on tab, we should be able to select it using focus and then give a comma and continue with the search.

.autocomplete({
    minLength: 0,
    source: function( request, response ) {
        // delegate back to autocomplete, but extract the last term
        response( $.ui.autocomplete.filter(productNames, extractLast(request.term)));
    },

    focus: function() {
        // prevent value inserted on focus
        //this.value = ui.item.value;
        return false;
    },

    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( ", " ); 
        return false;
    }

Upvotes: 0

Views: 3230

Answers (2)

vrooom
vrooom

Reputation: 51

for selecting multiple values using auto suggest and separating selection with comma with jquery UI autocomplete , you have to change it a lot.

instead you can use : MagicSuggest clean auto suggest with multiple selection and separation with comma

demo : country selection auto suggest

http://nicolasbize.com/magicsuggest/tutorial/3/

documentation:

http://nicolasbize.com/magicsuggest/doc.html

Upvotes: 2

Emilio Rodriguez
Emilio Rodriguez

Reputation: 5749

Have you tried TextExt instead of the JQuery autocomplete? it looks it fits better to your requirements: http://textextjs.com/manual/examples/filter-with-suggestions.html

Upvotes: 0

Related Questions