by anthony on 09/22/10 at 12:48 pm
People that live in the United States have a small convenience that people in other countries don’t have. Their country is likely the default option in country dropdown boxes in forms. This means they don’t have to spend their time and energy scrolling through a long list of over 100 country names looking for their country. Those that don’t live in the United States, however, may find themselves facing this user interface nightmare the next time they have to select their country on a form.
The good news is that there is a better way to select countries by using a different type of user interface control. The autocomplete textbox is a control that adapts to the user’s input. Instead of displaying an overwhelming list of countries in a dropdown box that fills up the entire screen, an autocomplete textbox only displays country names that match the letters you type in the textbox.
The benefit of this is that users don’t have to scroll through a giant list of country names in alphabetical order. The autocomplete textbox suggests a small collated subset of countries that matches the user’s input. As the user types in their country name, the autocomplete textbox will automatically narrow the giant list of countries down to a fraction. When you display fewer countries to the user, the user is able to find and select their country from the list faster and easier.
An autocomplete textbox is an efficient and effective replacement for the country dropdown box. It works well for countries because there are so many of them. When users have to scroll through over 100 countries in a dropdown box, an autocomplete textbox is the solution that will give your users a better form experience. It doesn’t matter what country they live in, all users want to do things better, faster and easier. Designers should always look for ways to design for that kind of experience.
Make it Happen
- jQuery Plugin: Autocomplete
- jQuery Plugin: Auto Complete
- jQuery Autocomplete
- Ajax Autocomplete for jQuery
- jQuery Tutorial – Creating an Autocomplete Input Textbox