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 Dev

Updating payment method email addresses in Stripe

You can't update the email address associated with a payment method in Stripe via their dashboard, you need to use the Stripe CLI

Ruby

Irreversible Rails Migrations

What are irreversible migrations and how might we use them to our advantage?