Я определил собственный шаблон для предложений в Bootstrap Typeahead, как указано ниже. Но когда я выбираю любое из предложений, я получаю на входе только название страны. Поскольку я передал country в параметре displayKey. Могу ли я в любом случае выбрать название страны и города при вводе (так же, как в шаблоне)?
Вот JsFiddle: http://jsfiddle.net/geekowls/agrg3xhj/
Я также прочитал примеры на веб-сайте Typeahead. Но ничего подходящего не нашел. Все, что я знаю, это то, что параметр displayKey может принимать функцию.
$(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>'
}
}
}
);
});
Вот JSON-файл.
[
{
"country": "Holland",
"city": "Amsterdam"
},
{
"country": "Belgium",
"city": "Brussel"
},
{
"country": "Germany",
"city": "Berlin"
},
{
"country": "France",
"city": "Paris"
}
]