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.

Obviously 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

Ruby SEO

SEO for Ruby on Rails projects

How to do technical SEO with your Ruby on Rails application

Ruby

Converting images to use Google's webp format

A quick guide to using Google's command line tool to convert images to webp format