In Typeahead version 0.11.1: Specify “limit” during the instantiation of the typeahead object to set the number of suggestions to display e.g. // Instantiate the Typeahead UI $(‘.typeahead’).typeahead(null, { limit: 10, // This controls the number of suggestions displayed displayKey: ‘value’, source: movies }); See a working example here: http://jsfiddle.net/Fresh/ps4w42t4/ In Typeahead version 0.10.4. The … Read more
Triggering input seems to do it. $(“.typeahead”).eq(0).val(“Uni”).trigger(“input”); Tested this on the example page.
Typeahead.js version 0.10.0 now uses a separate component called a suggestion engine for providing the suggestion data. The suggestion engine which ships with Typeahead.js is called Bloodhound. Hence you cannot “define remote without having to define a dataset function”. An example of this working with a remote data source (I’m querying the TheMovieDb API, try … Read more
There’s a great tutorial here that explains how to do this: http://tatiyants.com/how-to-use-json-objects-with-twitter-bootstrap-typeahead/ (read my comment on that page if it hasn’t been reflected yet in the main part of the post). Based on that tutorial, and the JSON you provided, you can do something like this: $(‘:input.autocomplete’).typeahead({ source: function(query, process) { objects = []; map … Read more
EDIT: Updated for Bootstrap 3.0 EDIT 2: Typeahead call was modified. See new jsfiddle After playing around with the styling it looks like the form-control class doesn’t quite line-up with the tt-hint. So I made sure the margins and borders line up. Taking Hieu Nguyen’s answer and adding border-radius and support for input-small/input-large CSS .twitter-typeahead … Read more
So looking into the docs I now see: By default, the dropdown menu created by typeahead.js is going to look ugly and you’ll want to style it to ensure it fits into the theme of your web page. My solution was thus to copy the styling from the example I wished to replicate: .tt-query, /* … Read more
Edit: typeahead is no longer bundled in Bootstrap 3. Check out: Where is the typeahead JavaScript module in Bootstrap 3 RC 1? typeahead.js As of Bootstrap 2.1.0 up to 2.3.2, you can do this: $(‘.typeahead’).typeahead({ source: function (query, process) { return $.get(‘/typeahead’, { query: query }, function (data) { return process(data.options); }); } }); To … Read more