Skip to content
This repository was archived by the owner on May 29, 2019. It is now read-only.

Commit 2423f6d

Browse files
committedApr 13, 2014
feat(datepicker): make widget accessible
* keyboard navigation * WAI-ARIA roles * popup will close on escape on input or calendar * handle focus when closing popup Closes #1922 BREAKING CHANGES: popup calendar does not open on input focus
1 parent de5a25e commit 2423f6d

File tree

8 files changed

+590
-127
lines changed

8 files changed

+590
-127
lines changed
 

‎src/datepicker/datepicker.js

+212-71
Large diffs are not rendered by default.

‎src/datepicker/docs/readme.md

+19-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ Everything is formatted using the [date filter](http://docs.angularjs.org/api/ng
77

88
### Datepicker Settings ###
99

10-
All settings can be provided as attributes in the `<datepicker>` or globally configured through the `datepickerConfig`.
10+
All settings can be provided as attributes in the `datepicker` or globally configured through the `datepickerConfig`.
1111

1212
* `ng-model` <i class="glyphicon glyphicon-eye-open"></i>
1313
:
@@ -65,7 +65,7 @@ All settings can be provided as attributes in the `<datepicker>` or globally con
6565
_(Default: 'EEE')_ :
6666
Format of day in week header.
6767

68-
* `format-day-title-`
68+
* `format-day-title`
6969
_(Default: 'MMMM yyyy')_ :
7070
Format of title when selecting day.
7171

@@ -110,3 +110,20 @@ Specific settings for the `datepicker-popup`, that can globally configured throu
110110
* `datepicker-append-to-body`
111111
_(Default: false)_:
112112
Append the datepicker popup element to `body`, rather than inserting after `datepicker-popup`. For global configuration, use `datepickerPopupConfig.appendToBody`.
113+
114+
### Keyboard Support ###
115+
116+
Depending on datepicker's current mode, the date may reffer either to day, month or year. Accordingly, the term view reffers either to a month, year or year range.
117+
118+
* `Left`: Move focus to the previous date. Will move to the last date of the previous view, if the current date is the first date of a view.
119+
* `Right`: Move focus to the next date. Will move to the first date of the following view, if the current date is the last date of a view.
120+
* `Up`: Move focus to the same column of the previous row. Will wrap to the appropriate row in the previous view.
121+
* `Down`: Move focus to the same column of the following row. Will wrap to the appropriate row in the following view.
122+
* `PgUp`: Move focus to the same date of the previous view. If that date does not exist, focus is placed on the last date of the month.
123+
* `PgDn`: Move focus to the same date of the following view. If that date does not exist, focus is placed on the last date of the month.
124+
* `Home`: Move to the first date of the view.
125+
* `End`: Move to the last date of the view.
126+
* `Enter`/`Space`: Select date.
127+
* `Ctrl`+`Up`: Move to an upper mode.
128+
* `Ctrl`+`Down`: Move to a lower mode.
129+
* `Esc`: Will close popup, and move focus to the input.

0 commit comments

Comments
 (0)