WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: How to make a sortable listbox using aria-grabbed and other ARIA attributes

for

From: Kevin Chao
Date: Nov 6, 2011 2:48PM


Thanks Brian for creating this ARIA Sortable Listbox Module Demo.
Unfortunately, it doesn't seem to be working properly. It's not
possible to add, navigate through listed item, select an item to grab,
or drop. I've attempted this using the various methods outlined in the
instructions.

Windows 7 x86
Firefox 10.0a1 (2011-11-06) Nightly
Chrome 17.0.931.0 canary
NVDA 2011.3-4762 Snapshot

http://whatsock.com/modules/aria_sortable_listbox_module/demo.htm
CTRL+HOME to go to top of page, E for edit field, ENTER to switch to focus mode;
DOWN, UP, HOME, or END
Expected: navigate through listed item by one item or to go to top or
bottom of listed item
Actual: Nothing at all, NVDA reports "blank"

TAB to "add button, add item to list" and ENTER or SPACE
Expected: some message or focus change, which will allow adding item to list
Actual: nothing at all

TAB several times to listed items, DOWN ARROW through items, and
SPACEBAR on items that you want to grab
Expected:When arrowing, some message alerting NVDA that it's possible
to grab, when SPACEBAR is pressed, a message indicating that item was
grabbed
Actual: Nothing at all, silence

ESC to swithc to browse mode, SHIFT+E to move back to edit field
Expected: These are a few of my favorite things:, multiline edit
field, grabbed items to be in edit field
Actual: These are a few of my favorite things: , multiline edit field,
and its empty

Next/previous heading/ARIA-Landmark
Expected: different sections, one to drop the selected items
Actual: There are no other sections/area to drop item(s)

Kevin

On 11/6/11, Bryan Garaventa < <EMAIL REMOVED> > wrote:
> Hi,
> I wanted to explore aria-grabbed in the context of a practical application,
> so came up with this.
>
> The ARIA Sortable Listbox Module dynamically converts standard list markup
> into a keyboard accessible sortable listbox control.
> Demo: http://whatsock.com/modules/aria_sortable_listbox_module/demo.htm
>
> In addition to aria-grabbed, various other ARIA attributes are used,
> including role=dialog, role=listbox, role=option (plus associated listbox
> attributes), and unobtrusive status messages to provide additional feedback.
>
> Hopefully this helps with the research of ARIA-based implementations.
>
> Instructions:
> . Press Enter on the edit field or activate the Add button to add a new list
> item;
> Activate Clear to empty the list, or activate Sort to toggle sortability of
> the list.
> . Using the mouse, click a list item to make a selection,
> then click any other list item to move the selected item to that location.
> . Using the keyboard, use the Up/Down/Home/End keys to navigate listed
> items.
> . Press the Spacebar to grab the selected item for moving;
> Press the Spacebar again after navigating to another location to move the
> grabbed item.
> . Press Delete on a selected item to remove it from the list.
> . Press Escape to cancel a previous grab action;
> Press Escape again or press Enter to close the listbox and disable
> sortability.
>
> All the best,
> Bryan
>