Transliteration with Typeahead.js

How to deal with special characters when using typeahead.js

Often in real world web applications we have to deal with words or characters that fall outside of the standard latin-based keyboard character set.

For example lets say we wanted our users to search through a list of torrent clients, a list wouldn’t be complete without including µTorrent, but here we have two problems.

  1. Very few people will know how to type µ or have the inclination to look it up.
  2. If they just type torrent, we presume that most torrent clients will have torrent in their name, so this isn’t going to narrow down the search too much.

The solution is to use tokens in our datum, so where as before we might have just had;

{"value": "µTorrent"}

We would now have;

{
  "value" : "µTorrent",
  "tokens": ["µTorrent", "uTorrent"]
}

Which means if our user types in ‘u’, typeahead.js will know to return µTorrent amongst the results.

I hope this post has helped someone, did you know I have written a book on Typeahead?

Recent posts View all

Web DevProductivity

Keeping on top of website updates

Learn what website updates are, what they entail, why they are important, and how we can help

Freelancing

Getting the most out of your agency

Here are some tips based on years of working with, for, and as an agency on how to get the most out of any work you do.