ブートストラップ先行入力は：ボックス内の異なるテキストは、かつて私は、このように検索し、ブートストラップ先行入力を使用しています

Question

を選択示します

$('.lookup').typeahead({ 

source: function (query, process) { 
    return $.getJSON(
     'json_autocomplete.php',{ query: query }, 
     function (data) { 

      var newData = []; 
       $.each(data, function(){ 

        newData.push(this.label); 
        //populate hidden field with id 
        $('#contact_id').val(this.id); 

       }); 

      return process(newData); 

     }); 
} 

}); 

JSONデータは次のようになります。それは素晴らしい取り組んでいる

[{"label":"Contact: Jeff Busch-> Busch, Jeff: 1975-11-24","value":"Busch, Jeff","id":"2096"}, ... 

。ユーザーが入力を開始すると、「ラベル」データが入力の下のリストに表示されます。しかし、ユーザーがリスト項目の1つをクリックすると、検索されたすべてのラベル情報ではなく、「値」テキストが入力テキストボックスに表示されます。

これは可能ですか？

ここでフィドルです：

http://jsfiddle.net/michels287/qdgo651h/

Answer 1

私は強くあなたがhttps://github.com/bassjobsen/Bootstrap-3-Typeaheadへのアップグレードをお勧めしますそれはちょうど、独自のリポジトリに維持され、バグフィックス、正確同じ古き良きブートストラップ2.xの先行入力でありますブートストラップ3.0は先読みをスキップしてtypeahead.jsになりました（これはもはやBTWがまったく保守されていません）。これは人生をはるかに容易にします。あなたは、単にすべてのねじれをスキップすることができた後

は、次の操作を行います。

$('#contact').typeahead({ 
    source: jsonData, 
    displayText: function(item) { 
    return item.label 
    }, 
    afterSelect: function(item) { 
    this.$element[0].value = item.value 
    } 
}) 

更新フィドルを - >http://jsfiddle.net/qdgo651h/1/

---

コメントごとに更新しました。私はあなたがsource一部それを行う必要があります

$('.lookup').typeahead({ 
    displayText: function(item) { 
     return item.label 
    }, 
    afterSelect: function(item) { 
     this.$element[0].value = item.value 
    }, 
    source: function (query, process) { 
    return $.getJSON('json_autocomplete.php', { query: query }, function(data) { 
     process(data) 
    }) 
    } 
}) 

をovercomplicateと信じています。 >http://jsfiddle.net/hwbnhbdd/1/ あなたはアップデートのようにフィドルにAJAXソースとしてhttp://myjson.com/を使用することができます - 以下のコメントからフィドルを更新しました。

Answer 2

ただ、このようなアップデータイベントにデータを返す：

updater: function (item) { 
     $('#id').val(map[item].id); 

     //Here we return the text to display on the input control 
     return map[item].autocomplete; 
    },