Creating An Autosuggest Textbox

It’s been a long time since I’ve had the extra time to write some articles. Now that my book is finished, I intend to get back to writing these articles. To that end, the first one is now up over at WebReference. This is the first in a three-part series on how to emulate Google Suggest functionality. Check it out: Creating an Autosuggest Textbox with JavaScript, Part 1.

Comments

  1. Happy Steve

    It&#039s a really great article, but the example page does seem to be working. (Looks like the "suggestions1.js" file is missing.)

    I especially liked learning about the Partial Text Selection. I was wondering how that worked. Thanks! Looking forward to the next two parts.

  2. Nicholas C. Zakas

    Sorry about that, I&#039ll contact the editor at WebReference to fix it. In the meantime, the downloadable ZIP file contains all the necessary files.

  3. Frank Stahl

    Thank you for this very good article. The example and the download, however, doesn&#039t don&#039t at all. I tried it on the PC on IE 6, Firefox 1.0.2, Mozilla 7.1 and Opera 7.5 but there is no typeahead at all.

  4. Nicholas C. Zakas

    I&#039ve double-checked the examples on both IE 6 and Firefox 1.0.1, and they seem to work fine. The example will not work on Opera, as there is no way to select only part of the text in a textbox. Remember, this example is case sensitive, so if you&#039re typing "missouri", you&#039ll get no suggestions; you need to type "Missouri" to get a suggestion.

  5. Keith Reed

    Good article. I&#039ll probably buy your Wrox book.

    The "AutoSuggest" concept isn&#039t that new though. Matt Kruse offered an open source version called "AutoComplete" several years ago.

  6. Nicholas C. Zakas

    Thanks Keith. I&#039m aware that the autosuggest functionality isn&#039t all that new, and I&#039m aware of Matt&#039s script. I also wrote an article in 2003 for Sitepoint explaining the autocomplete functionality as well (check out the Writing section). In any event, I hope you enjoy the next two parts of the article.

Understanding JavaScript Promises E-book Cover

Demystify JavaScript promises with the e-book that explains not just concepts, but also real-world uses of promises.

Download the Free E-book!

The community edition of Understanding JavaScript Promises is a free download that arrives in minutes.