Keyboard Use of Mines Help Center Datepicker Control

Overview

This article explains how to use the TeamDynamix datepicker control with a keyboard.

TeamDynamix Datepicker Control

The datepicker control can be reached by standard keyboard navigation methods. When navigating by tabbing there may be a help block immediately before the datepicker control. By default the help text will outline the purpose of the date being selected. For example, the Start Date field on the Ticket New page has help text that by default reads, "The start date indicates the date that the work on the ticket is to begin. If the ticket has estimated hours associated, the start date is the beginning of the resource allocation range." The help text will vary as it is specific to the input field. Following the help text screen reader users will be informed of the required format for the datepicker. The required format is MM/DD/YYYY.

TeamDynamix datepicker control displayed without keyboard focus

TeamDynamix datepicker with calendar control revealed

 

When the datepicker receives focus the calendar portion of the control will appear. Using the calendar portion of the control is optional but can be done with the keyboard alone. To use the calendar control hold Ctrl and use the arrow keys to navigate through the calendar. The starting point will be today's date. Pressing the Enter key will submit the currently selected date. When doing this each of the following keys will have a specific response:

  • Ctrl + Left Arrow moves back one day
  • Ctrl + Up Arrow moves back one week
  • Ctrl + Right Arrow moves forward one day
  • Ctrl + Down Arrow moves forward one week

Note: screen readers may override the functionality outlined above. Using the calendar portion of the datepicker control is not the easiest method for users of assistive technology. Screen reader users are advised that the datepicker will be satisfied with a typed date in the MM/DD/YYYY format. The user can then navigate using standard methods to move onto the next form field or to submit the form.

TeamDynamix Datetimepicker Control

Some datepickers also allow a time entry, and these controls are referred to as datetimepicker controls. Just as is the case with a datepicker control, screen reader users will also be informed of the required format for the datetimepicker control. The required format for the datetimepicker control is MM/DD/YYYY HH:MM AM/PM.

TeamDynamix datetimepicker

In addition to the keyboard shortcuts that are supported by the datepicker control, the datetimepicker control also supports the following shortcuts for time selection:

  • Ctrl + [ moves back one hour
  • Ctrl + ] moves forward one hour
  • Ctrl + , moves back one minute
  • Ctrl + . moves forward one minute