Alternative List Box UI
List boxes can act as a set of radio buttons (allowing people to select exactly one choice from a set of mutually exclusive options) or as a set of checkboxes (allowing people to select any number of choices from a list of options). List boxes can be configured to show more options than a drop-down menu while still taking up less screen real estate than a list of radio buttons or checkboxes. Despite these advantages, the dual nature of list boxes (mutually exclusive single selection or multiple selection) tends to cause problems for many people. As a result, list boxes are rarely used in Web forms.
On Functioning Form, I discuss an alternative solution for selecting multiple options within a form: Alternate Select Multiple.
Comments
What is still missing from that “solution” is keyboard accessibility: blind users and users with certain mobility impairments can't drag and drop with a pointing device.
Ryan Cramer's article links to related resources, some of which have keyboard issues.
The "Multi Select Transfer with jQuery" (on Jeremy Martin's blog) that is also listed is unusable from the keyboard: pressing the spacebar when an item has focus doesn't cause the item to be selected and highlighted. Focusing on an item, tabbing to the Add button and pressing Enter has no effect either.
The Drupal multiple select jquery test doesn't seem to work from the keyboard either.
The scrollable checkboxes, by contrast, can be used with a keyboard. Incidentally, this is a technique that doesn't rely on JavaScript.
The jQuery MultiSelect demo (“Scrollable pulldowns”) on Cory S.N. LaViska's blog works from the keyboard.
Posted by: Christophe Strobbe | September 17, 2008 11:13 AM