Wie bekomme ich den Wert von id in twitter typeahead?

Question

Ich habe twitter typeahead implementiert, damit ein Benutzer seinen Standort auswählen kann. Er tippt seinen Standort name ein, wählt dann aus der Liste aus und der id des Ortes, den er ausgewählt hat, wird auf dem Formular veröffentlicht.

Dies funktioniert gut, und ich nehme an dieser folgenden Liste haben:

[ 
    United States : 1, 
    Canada : 2, 
    England: 3, 
    China: 4, 
    India: 5, 
    .... // other locations 
] 

Jetzt ein Benutzer Kanada wählen Sie das Formular aus, die ID 2 wird in der Datenbank gespeichert. Aber wenn der Benutzer zum selben Formular zurückkehrt, mache ich eine Abfrage, um den von ihm gewählten Ort zu erhalten, in diesem Fall wird die ID 2 zurückgegeben.

Wie wähle ich automatisch Kanada in der Typehead, um die Position anzuzeigen, die er ausgewählt hat?

ich versuchte

$('.typeahead').typeahead('val', value) //where value = 2 

aber nicht

Answer 1

funktioniert Da die typeahead Kontrolle ist „nur“ ein HTML-Eingang, es gibt keinen Mechanismus einen Textwert für bevöl basierend auf einem ID-Wert aufgebaut ist . Sie müssen diesen Teil selbst tun.

I've created a fiddle to demonstrate.

Sie können eine Vielzahl von verschiedenen Methoden verwenden, um dies zu erreichen, aber ich benutze on focus es in meiner Implementierung zu behandeln.

.on('focus', function() { 
    if (defaultOption.length) { 
     var nm = $.map(locs, function(obj) { 
     if (obj.id === defaultOption) 
      return obj.name; // or return obj.name, whatever. 
     }); 
     console.log(nm); 
     $(this).data().ttTypeahead.input.trigger('queryChanged', nm); 
    } 
    }); 

In diesem Fall ich sende einen default (das wäre, was wieder aus der Datenbank kommt) und das Hinzufügen sie dann an der Quelle als den ersten Punkt und dann das Auslösen der Abfrage geändert Ereignis.

Eine andere Möglichkeit, dies zu handhaben, wäre, einfach den erwarteten Wert in das Eingabefeld einzugeben. Ich habe eine Demonstration gezeigt, wie du am Ende der verbundenen Geige damit umgehen kannst. Der Code sucht nach einem Standardwert und füllt dann die Eingabe mit dem korrekten Namen.

if (defaultOption.length) { 
    nm = $.map(locs, function(obj) { 
     if (obj.id === defaultOption) 
     return obj.name; // or return obj.name, whatever. 
    }); 
    } 

    $('.typeahead').val(nm);