Auto-Completing Form Fields

A first-rate way to help your site’s visitors is to lessen the drudgery of data entry into fields. Helping them fill out forms that have a large number of choices saves them time and effort, and additionally helps provide your site with valid data.

For this example, Script 13.16 (HTML), Script 13.17 (CSS), and Script 13.18 (JavaScript) automatically show a list of U.S. states that match the letters the user types into a form field (Figure 13.7). As the user continues typing, the list shrinks until there is only one state left; this is then automatically put into the entry field, and the list goes away.

Figure 13.7. As you type, the number of possible choices narrows.

Script 13.16. This simple HTML provides the ...

Get JavaScript and Ajax for the Web: Visual QuickStart Guide, Seventh Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.