I've got an instance of Typeahead running, pulling in JSON from a remote URL, and it all seems to be working OK except that the UI instance seems to be ignoring a couple of my options, namely 'minLength' and 'highlight'. The code I'm using is as follows:
var airportsList = new Bloodhound({
name: 'airports',
limit: 20,
remote: {url: "http://full-url-here/search/%QUERY",
ajax: {type:'post',dataType:'jsonp',headers: {'cache-control': 'no-cache'}},
filter: function (parsedResponse) { return parsedResponse.locations; }
},
datumTokenizer: function(d) {
return Bloodhound.tokenizers.whitespace(d.name);
},
queryTokenizer: Bloodhound.tokenizers.whitespace
});
// initialize the bloodhound suggestion engine
airportsList.initialize();
// instantiate the typeahead UI
$('.typeaheadField').typeahead(null, {
displayKey: 'name',
minLength: 3,
highlight: true,
source: airportsList.ttAdapter()
});
Looking at my parameters in the typeahead instance, it's definitely picking up the values for 'displayKey' and 'source' but seems to be ignoring those middle two for some reason...?
minLength
and highlight
are top-level configs and not per-dataset, so try this:
$('.typeaheadField').typeahead({
minLength: 3,
highlight: true
},
{
displayKey: 'name',
source: airportsList.ttAdapter()
});