Datepicker widgits are common on the web today and typically have been difficult to use via screen reader. One of the main difficulties is that there are typically two points of regard when using the datepicker: the calendar, and the input field where the date is to be inserted.
Here we use the jQueryUI datepicker widgit to display the calendar. The widgit has keyboard support such that control+arrow keys will move the highlight around the calendar. We have also extended the keyboard support to use unmodified arrows as well, since sometimes Jaws will pop out of the input field when control + up / down arrow key is pressed.
In the keyboard handler we track the highlight and stick a formatted representation of the currently highlighted date into a hidden live region, thus causing the screen reader to speak the highlighted date. The beauty of this approach is that the focus never leaves the input field, but the screen reader user will still receive the bennefits of a live calendar from which to choose a date without having to actually navigate the table.
Here are the currently implemented keyboard commands:
Note that since arrow keys are mapped to control + arrow keys to work around Jaws buggy behavior, it is not possible to read / edit the current date string with left/right arrow keys until enter is pressed. At that point, the calendar closes and all keyboard behavior is restored. Focus stays in the input field so you can read / edit the date as desired.