I'm able to populate all the required suggestions using typeahead.js The problem is that i'm having to double click the autocomplete suggestion for it to populate into the text field. I can't seem to figure out why this isn't working on a single click.
Initialising typeahead with bloodhound:
var titlesOnlyHound = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.whitespace,
queryTokenizer: Bloodhound.tokenizers.whitespace,
local: titlesOnly
});
$('#titles').typeahead({
hint: true,
highlight: true, /* Enable substring highlighting */
minLength: 1 /*Specify minimum characters required for showing suggestions */
},
{
name: 'titlesOnly',
source: titlesOnlyHound,
limit: 5,
templates: {
empty: [
'<div class="empty-message">No matching ideas found!</div>'
]
}
});
Here is my HTML:
<div class="form-group" id="bloodhound">
<label for="autocomplete-input">Email address</label>
<input type="text" class="form-control typeahead" id="titles" autocomplete="off">
</div>