Giá trị trả lại bằng chức năng Typeahead của Bootstrap Chức năngKeyKey

Question

Tôi đã xác định mẫu tùy chỉnh cho các đề xuất trong Typehead của Bootstrap như được đề cập bên dưới. Nhưng khi tôi chọn bất kỳ đề xuất nào, tôi chỉ nhận được tên quốc gia trong đầu vào. Vì tôi đã vượt qua quốc gia trong thông số displayKey. Có cách nào để tôi có thể chọn cả hai tên quốc gia và thành phố tên trong đầu vào (Giống như trong mẫu)?

Đây là JsFiddle: http://jsfiddle.net/geekowls/agrg3xhj/

Tôi cũng đã đọc các ví dụ trên trang web Typeahead. Nhưng không tìm thấy bất cứ điều gì có liên quan. Tất cả những gì tôi biết là tham số displayKey có thể lấy một hàm.

$(document).ready(function() { 

         var dataSource = new Bloodhound({ 
          datumTokenizer: Bloodhound.tokenizers.obj.whitespace('country', 'city'), 
          queryTokenizer: Bloodhound.tokenizers.whitespace, 
          identify: function (obj) { return obj.country; }, 
          prefetch: "../Data/1.json" 

         }); 

         function dataSourceS(q, sync) { 
           dataSource.search(q, sync);   
         } 

         $('.typeahead').typeahead({ 
          minLength: 0, 
          highlight: true 
         }, { 
          name: 'countries', 
          displayKey: 'country', 
          source: dataSourceS, 
          templates: { 
           empty: [ 
            '<div class="empty">No Matches Found</div>' 
           ].join('\n'), 
           suggestion: function (data){ 
            return '<div>' + data.country + ' – ' + data.city + '</div>' 
           } 
          } 
         } 
         ); 
}); 

Đây là tệp Json.

[ 
    { 
    "country": "Holland", 
    "city": "Amsterdam" 
    }, 
    { 
    "country": "Belgium", 
    "city": "Brussel" 
    }, 
    { 
    "country": "Germany", 
    "city": "Berlin" 
    }, 
    { 
    "country": "France", 
    "city": "Paris" 
    } 
] 

Answer 1

Hàm này đủ đơn giản. Chỉ cần để cập nhật các hiển thị tham số như:

display: function(item){ return item.country+'–'+item.city} 

Cũng cập nhật mã trên fiddle đây: http://jsfiddle.net/geekowls/agrg3xhj/1/

Cheers!