Typeahead always shows only 5 suggestions maximum

Question

I have the below code using Typeahead.js for suggestions. I have no major issues on the code as it works fine.

The minor issue I face is that any given time, I see only 5 suggestions even though there are more than 5 suggestions from the remote URL.

var isearch = new Bloodhound({     datumTokenizer: function(d) {           return Bloodhound.tokenizers.whitespace(d.value);      },     queryTokenizer: Bloodhound.tokenizers.whitespace,     remote: "http://localhost/search/get-data/%QUERY" });  isearch.initialize();    $("#search_box .typeahead").typeahead(null,{ name: "isearch",     displayKey: "value",     source: isearch.ttAdapter(),     templates: {          suggestion: Handlebars.compile("{{value}}")     } }); 

What I expect is that there are more suggestions, there should be a scroll bar for users to see.

Answer 1

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 Bloodhound suggestion engine has a default value of five for the "limit" option (i.e. The max number of suggestions to return from Bloodhound#get)

You can increase the limit by specifying the desired value when you instantiate your Bloodhound object. For example, to specify a limit of 10:

var isearch = new Bloodhound({  datumTokenizer: function(d) {       return Bloodhound.tokenizers.whitespace(d.value);   },  queryTokenizer: Bloodhound.tokenizers.whitespace,  remote: "http://localhost/search/get-data/%QUERY",  limit: 10 }); 

An example of an instance of Typeahead where the limit is set to 10 can be found here:

http://jsfiddle.net/Fresh/w03a28h9/

Answer 2

In my case 'limit' option worked but in different way. I had to put limit option on typeahead instead of Bloodhound. I am posting my case, so that it might help someone.

bloodhoundSuggestionEngine = new Bloodhound({ datumTokenizer : function(d) { return Bloodhound.tokenizers.whitespace(d.key); }, queryTokenizer : Bloodhound.tokenizers.whitespace, local : myOptions });  $("#myinputbox").typeahead({ minLength : 3, highlight : true }, { displayKey : 'key', source : bloodhoundSuggestionEngine.ttAdapter(), limit: 10 });