Version

Keyboard Navigation (igTimePicker)

Topic overview

This topic explains how to use keyboard navigation so that end-users can easily and quickly navigate through inputs and interact with them.

In this topic

This topic contains the following sections:

Standard Keyboard interactions

You can use the standard key combinations for operations such as copy, cut, paste, undo and redo.

Press To
Right Arrow Move the caret one char to the right
Left Arrow Move the caret one char to the left
Ctrl + Right Arrow Move the caret one part of the time input to the right
Ctrl + Left Arrow Move the caret one part of the time input to the left
Ctrl + Home or just Home Move the caret to the start of the input
Ctrl + End or just End Move the caret to the end of the input
Backspace Delete the previous char
Delete Delete the following char
Ctrl + Backspace Delete the previous part of the time input
Ctrl + Delete Delete the following chunk
Up Arrow Increment the current time part in the input field
Down Arrow Decrement the current time part in the input field

Selecting the editor

In this section you can see the key combinations that can be used to focus the editor and select part of its value or the whole one.

Press To
Tab or Shift + Tab Focus the editor
Shift + Tab Focus the previous component
Tab Focus the following component
Shift + Right Arrow Right symbol selection in the time input
Shift + Left Arrow Left symbol selection in the time input
Ctrl + Shift + Right Arrow Right selection of time parts
Ctrl + Shift + Left Arrow Left selection of time parts
Ctrl + Shift + Home or Shift + Home Select value in the input till start
Ctrl + Shift + End or Shift + End Select value in the input till end
Ctrl + A Select the whole value in the input

igTimePicker specific navigation

Press To
Alt + Down Arrow Open the dropdown, when the focus is in the input
Alt + Up Arrow Close the dropdown, when the focus is in the input
Down Arrow Spin down the current time part depending on the position of the mouse indicator
Up Arrow Spin up the current time part depending on the position of the mouse indicator
Ctrl + Right Arrow Move to the next time part
Ctrl + Left Arrow Move to the previous time part
Enter Confirm focused item as selected
Enter or Alt + Up Arrow Reject the focused item and keep the old selection

Related Topics

View on GitHub