I'm following this one http://twitter.github.io/typeahead.js/examples/#multiple-datasets and then got it working using remote, retrieving data from database. Now I want to make the results into links like when you click to a result it will redirect to another page named view.php?id=# with the id. How to do that?
Update1: So I tried Handlebars and I don't know why it's not working. Below is my code. I didn't mind about the id yet because my code didn't work. I tested the name first.
var searchResult = new Bloodhound({
datumTokenizer: function (d) {
return Bloodhound.tokenizers.whitespace(d.name);
},
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: 'data.php?q=%QUERY',
filter: function (results) {
return $.map(results, function (result) {
return {
name: result.cl_fname
};
});
}
}
});
searchResult.initialize();
$('#multiple-datasets .typeahead').typeahead({
hint: true,
highlight: true
},
{
name: 'cl-name',
displayKey: 'name',
source: searchResult.ttAdapter(),
templates: {
empty: [
'<div class="empty-message">',
'Cannot find.',
'</div>'
].join('\n'),
suggestion: Handlebars.compile('<p><strong>{{name}}</p>')
}
});
I got it working now. I didn't know Handlebars was a different library so I figured it out and downloaded it.