Anzeige des Namens und Auswahl der ID bei der Auswahl für Twitter Typeahead

Question

Ich versuche, twitter typeahead in mein Projekt zu implementieren, da ich als Quelle remote bin. Ich bin in der Lage, die Verbindung zwischen dem Front-End-Abfragetext und dem SQL herzustellen. Die Rückantwort sieht wie folgt aus:

[ 
{ 
    id: 1, 
    name: 'user one' 
}, 
{ 
    id: 2, 
    name: 'user two' 
} 
.. 
] 

Die typeahead zeigt die Übereinstimmungen ergeben aber es enthält die ID zusammen mit den Namen in der Auswahl, anstatt nur den Namen. Zweitens möchte ich den ID-Wert auf select bekommen, aber das: select gibt immer den Namen-Wert anstelle der ID an.

hier ist mein Code:

  var source = new Bloodhound({ 
       datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'), 
       queryTokenizer: Bloodhound.tokenizers.whitespace, 
       remote: { 
        url:"{{ path('user_typeahead') }}"+'?string=%QUERY', // twig path 
        wildcard: '%QUERY', 
        filter: function (results) { 
         // Map the remote source JSON array to a JavaScript object array 

         return $.map(results, function (result) { 
          return { 
           value: result 
          }; 
         }); 
        } 
       } 
      }); 
      // Initialize the Bloodhound suggestion engine 
      source.initialize(); 

      $('#typeahead').typeahead(null, { 
        display: 'value', 
        source: source.ttAdapter(), 
        limit:5, 
        highlight: true, 
        hint: true 
       }); 

      $('#typeahead').bind('typeahead:select', function(ev, suggestion) { 
       console.log(suggestion); 
      }); 

Answer 1

die Sie interessieren,

1. Anzeige sollte auf die Eigenschaft des JSON-Objekt gesetzt werden. display: 'id'

2. Verketten Sie das benutzerdefinierte Ereignis. Greifen Sie auf Ihre ID von suggestion.id.

   $('#typeahead').typeahead(null, { display: 'id', source: source.ttAdapter(), limit:5, highlight: true, hint: true }).bind('typeahead:select', function(ev, suggestion) { console.log(suggestion); });