With bootstrap3-typeahead, I made it to work with the following code:
<input id="typeahead-input" type="text" data-provide="typeahead" />
<script type="text/javascript">
jQuery(document).ready(function() {
$('#typeahead-input').typeahead({
source: function (query, process) {
return $.get('search?q=' + query, function (data) {
return process(data.search_results);
});
}
});
})
</script>
The backend provides search service under the search
GET endpoint, receiving the query in the q
parameter, and returns a JSON in the format { 'search_results': ['resultA', 'resultB', ... ] }
. The elements of the search_results
array are displayed in the typeahead input.