Setting a minimum length for your search in Typeahead.js

How you can set a minimum length for your search in Typeahead.js

I was looking through the Jasmine tests for Typeahead.js whilst doing research for a book I am writing on the subject and I noticed a handy little thing that isn’t documented on the Github page.

You can pass in minLength with your dataset and this means no lookups will be completed until the user has entered in enough characters, for example;

$('#people').typeahead({
  name: 'people',
  prefetch: './names.json',
  minLength: 3
});

This helps to greatly reduce the amount of lookups your code will do and will be helpful when you know that the first couple of characters the user enters is going to bring back too many results to be useful.

You don’t want to set this value to be greater than the length of your smallest possible return value, and if you make it too large the user might not know that there is a typeahead feature enabled.

I hope this helped, if you want to learn more about Typeahead.js I have written a book on it!


Recent posts View all

Web DevMarketing

Getting more out of Plausible

Some things we've done to up our Plausible analytics game

Web Dev

Creating draft posts in Jekyll

How to create and develop with draft posts in Jekyll