Designing UX: Forms by Jessica Enders

Author:Jessica Enders [Enders, Jessica]
Language: eng
Format: epub, mobi
Publisher: SitePoint Pty. Ltd.
Published: 2017-03-16T04:00:00+00:00

Implementing Country Text Box with Autosuggest

The way you implement country text box with autosuggest can influence its usability. A good explanation of the main features can be found in “Redesigning The Country Selector”. The resulting plugin can be found on the Baymard Institute’s site.

But remember, a text box with autosuggest is an alternative to all long lists, not just country selection. Here’s another example, this time a long list of radio buttons for selecting medical speciality. The radio buttons took up seven mobile screenfuls, even with the keyboard hidden!

First screenful of a question collecting medical speciality via a long list of radio buttons

Things work much better with a text box plus autosuggest:

The same question with a text box plus autosuggest for the answer field

If users won’t know the options without seeing them, you might have to use a dropdown, unless you have the resources to make a custom widget. The UK government digital service created just such a widget for their listing of “Competition and Markets Authority cases”:

Custom widget to allow multiple selections from a long list of options

Because of the special wording used to categorize cases, the types had to be shown to users. A list of checkboxes would have taken up too much space, yet the designers didn’t want to use a multi-select dropdown. In came the custom widget.

As the developers of this custom widget will tell you, it was not easy to build. Because of the large number of browser and operating system combinations, custom widgets take a lot of time to code and test. So they really should be your least preferred option.

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.