WebAIM - Web Accessibility In Mind

E-mail List Archives

Regarding an ARIA calendar picker control that supports automatic accessibility for SR and keyboard users

for

From: Bryan Garaventa
Date: Dec 16, 2011 12:33AM

Hi,
I started working on this one mainly to see if I could get the ARIA grid type roles working using a practical implementation, such as a calendar picker control that supports full accessibility. Unfortunately though, it appears that role=grid and all associated roles have no impact on tabular navigation structures. So I switched to plan B and used role=dialog, role=button, role=link, aria-selected, aria-label, and tabindex to do it anyway.

This is what it does, in the standard fashion of calendar pickers, you just click the Calendar link to open the Calendar picker control.
Then you can use the arrow keys to navigate each cell of the grid in tabular fashion using the structure of the underlying table.
Press Home or End to jump to the beginning or end of a row,
or PageDown or PageUp to jump to the next calendar month.
The buttons for moving forward and backward can also be accessed using ShiftTab, since focus is automatically set on the current day of the month by default.
Press enter on a date to make a selection, or press Escape or Tab to cancel and close the calendar.
You can also just click on a date to select it. (Boring and very sad...)

If you'd like to give it a spin, the demo is at
http://whatsock.com/modules/aria_calendar_module/demo.htm

This functionality works best with JAWS12/13 with IE8/9 and FF, and NVDA with FF.

Best wishes,
Bryan


http://www.linkedin.com/in/bgaraventa