JQuery Autocomplete Änderungsquelle

Question

Ich habe Fiddle here

Und ich brauche availabletags1 als Quelle, wenn es Auswahl1 Optionsfeld ist ausgewählt und availabletags2 wenn choice2 Optionsfeld gewählt wird. Und ich muss dies dynamisch durch tatsächliche Benutzerauswahl ändern.

Code:

var availableTags1 = [ 
"ActionScript", 
"AppleScript", 
"Asp" 
]; 

var availableTags2 = [ 
"Python", 
"Ruby", 
"Scala", 
"Scheme" 
]; 

$("#autocomplete").autocomplete({ 
source: availableTags1 
}); 

$('input[name="choice"]').click(function(){ 
if(this.checked){ 
    if(this.value == "1"){ 
     $("#autocomplete").autocomplete('option', 'source', availableTags1) 
    } else { 
     $("#autocomplete").autocomplete('option', 'source', availableTags2) 
    } 

Answer 1

Versuche

$('input[name="choice"]').click(function(){ 
    if(this.checked){ 
     if(this.value == "1"){ 
      $("#autocomplete").autocomplete('option', 'source', availableTags1) 
     } else { 
      $("#autocomplete").autocomplete('option', 'source', availableTags2) 
     } 
    } 
}) 

Demo: Fiddle

Answer 2

Für alle diese im Jahr 2016 zu lesen und darüber hinaus gibt es einen besseren Weg, um die request/response Muster. jQuery Autocomplete hat eine source Option, die eine Funktion akzeptiert, die beim Aufruf durch das Plugin zwei Argumente erhält: request und response. request ist ein Objekt, das Informationen über die Autocomplete-Komponente enthält, nämlich request.term, was der Wert des Eingabefelds ist. response ist eine Funktion, die einen einzelnen Parameter akzeptiert, die zurückgegebenen Daten response(data). Wie Sie in meinem Beispiel unten sehen können, können Sie diese Option verwenden, um eine Ajax-Anfrage zu erleichtern. Sie können einfach die request Funktion als Erfolg Rückruf an jQuery $.ajax Methoden übergeben und es wird wie vorgesehen arbeiten. Sie können auch andere coole Sachen mit diesem Muster machen, wie die Suche im Speicher, wenn Sie bereits einige Daten geholt und zwischengespeichert haben, so dass nachfolgende Suchen mehr Echtzeit für Benutzer ergeben.

$('#term-search').autocomplete({ 
    source: function(request, response) { 
     $.ajax({ 
      url: $('#api-endpoint').val(),//whether you are using radios, checkboxes, or selects, you can change the endpoint at runtime automatically 
      dataType: "json", 
      data: { 
       query : request.term,//the value of the input is here 
       language : $('#lang-type').val(), //you can even add extra parameters 
       token : $('#csrf_token').val() 
      }, 
      success: response //response is a callable accepting data parameter. no reason to wrap in anonymous function. 
     }); 
    }, 
    minLength: 1, 
    cacheLength: 0, 
    select: function(event, ui) {} //do something with the selected option. refer to jquery ui autocomplete docs for more info 
});