Wie Autocomplete wie Google mit dynamischen Anfrageparametern implementieren?

Question

Ich verwende die jQuery-Plugin Autocomplete like Google für ein Formularfeld foo:

$(function() { 
    $("#foo").autocomplete({ 
     minLength: 3, 
     limit: 5, 
     source : [{ 
      url:"/my/ajax/controller/foo?data[name]=%QUERY%", 
      type:'remote' 
     }], 
    }); 
}); 

Die URI /my/ajax/controller/foo?data[name]=%QUERY% den Datenbankdienst ruft (dh eine Anweisung wie SELECT * FROM foo WHERE name LIKE %name% ausführt), prepaires die Daten und stellt ein einfaches Array wie ['qwer', 'asdf', 'yxcv'] .

Jetzt möchte ich Autocomplete zu einem anderen Feld hinzufügen (bar). Der Unterschied ist, dass der aktuelle Wert des foo zum Filtern benötigt wird, da die Ziel-SQL-Abfrage wie SELECT * FROM bar WHERE number JOIN foo ON bar.foo_name = foo.name WHERE number LIKE %number% AND foo.name = foo_name aussieht. Hier ist, wie ich versuchte, es zu implementieren:

$(function() { 
    $("#bar").autocomplete({ 
     minLength: 3, 
     limit: 5, 
     valueKey:'number', 
     source : [{ 
      url:"/my/ajax/controller/bar?data[number]=%QUERY%&data[foo_name]=" + $('#foo').val(), 
      type:'remote' 
     }], 
    }); 
}); 

Aber der Wert der foo wird nur einmal gelesen - wenn die Seite geladen wird. Das heißt, die Änderungen und der aktuelle Wert werden dann ignoriert. Ich habe versucht, einen Callback anstelle der URL zu übergeben, aber es hat nicht funktioniert.

Wie bekomme ich "Autocomplete wie Google" arbeiten mit dynamisch wechselnden Feldern?

Answer 1

$(function() { 
    $("#bar").autocomplete({ 
     minLength: 3, 
     limit: 5, 
     source : [ 
      function(q,add){ 
       $.getJSON("/my/ajax/controller/bar?data[number]=" + q + "&data[foo_name]=" + $('#foo').val(), function(resp) { 
        add(resp); 
       }) 
     }], 
    }); 
});