Typeahead custom template Without Handlebars
Use this format:
suggestion: function(data) { return '<p><strong>' + data.value + '</strong> – ' + data.year + '</p>';}Taken from this thread.
This might help - I've integrated it with Bootstrap:
<div class="col-lg-3" id="the-basics"><input type="text" class="typeahead form-control" placeholder="my placeholder" aria-describedby="basic-addon1"></div>$('#the-basics .typeahead').typeahead(null, { name: 'best-pictures', display: 'imageUrl', source: function show(q, cb, cba) { console.log(q); var url = '/yoururl/'+q; $.ajax({ url: url }) .done(function(res) { cba(res.list);; }) .fail(function(err) { alert(err); }); }, limit:10, templates: { empty: [ '<div class="empty-message">', 'No data', '</div>' ].join('\n'), suggestion: function(data) { return '<p><strong>' + data.itemName + '</strong> - <img height:"50px" width:"50px" src='+data.imageUrl+'></p>'; } }});