Keyboard Access for UI Elements in Web Dynpro (Traditional Rendering)

This document describes keyboard access for the most important UI elements in applications running in the HTML client and based on Web Dynpro for ABAP or Web Dynpro for Java. This information on keyboard access is relevant to you if you use the keyboard to navigate around your application's UI and use its functions.

Prerequisites

The keyboard access described in this document is only valid for the classic rendering of Web Dynpro. The keyboard access for the new rendering is described under Keyboard Access of Interface Elements in Web Dynpro (New Rendering).

To use the keyboard commands described here, you must enable accessibility mode. Many keyboard commands also work when accessibility mode is activated. There are however some keyboard commands that only function in accessibility mode, such as, group navigation or navigation for inactive interface elements for example.

Features

Keyboard Commands

The table below lists the most important UI elements and shows you the actions performed by each UI element and the keyboard commands associated with these actions.

Note Note

The table shows you the original name of each UI element. The technical name has been retained because of its uniqueness. You can find the corresponding German in brackets, however this does not represent a name of the interface element that is generally valid. The link incorporated into the name of the UI element takes you to its documentation in Web Dynpro for ABAP.

In this document, the phrase Moves the focus forwards indicates that (within the tab order) you are able to move the focus rectangle forwards to a UI element and then further forwards to the next UI element. The phrase Moves the focus backwards indicates that (within the tab order) you are able to move the focus rectangle backwards to a UI element and then further back to the previous UI element.

End of the note.

Example Example

You can use the Tab key to move the focus rectangle forwards to the Button UI element. Once the focus is on the Button element, you can trigger the associated function by pressing the Enter key or the Space key. You can use the key combination Shift + Tab to move the focus rectangle backwards from the Button element.

End of the example.

Key Access in Web Dynpro: Overview

UI Element	Action	Keyboard Command
BreadCrumb (Navigation Path)	Moves the focus forwards The focus is then on the subelement currently selected.	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves between the subelements of the element	`Arrow right` and `Arrow left`
	Triggers the focused subelement	`Space`
Button (Pushbutton)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Triggers the focused element	`Enter` or `Space`
	Triggers the element that is activated by default (the element is triggered even when it does not have the focus)	`Enter`
CheckBox (Checkbox) CheckBoxGroup (Groups from Checkboxes)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves between the checkbox elements	`Tab`
	Activates the focused checkbox (sets or removes the flag)	`Space`
DateNavigator (Date Selection)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Activates the focused element	`Space`
	Moves between the subelements (days) of the element	`Arrow keys`
	Selects the focused subelement	`Space`
DropDownByIndex DropDownByKey (Dropdown Box)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves between the items in the list box	`Arrow down` and `Arrow up`
	Moves to the first item in the list	`Ctrl` + `Home`
	Moves to the last item in the list	`Ctrl` + `End`
	Selects the selected item in the list	`Enter`
	Opens/closes the list box	`Alt` + `Arrow down` / `Arrow up` or `F4`
Group (Group)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Forwards group navigation	`F6`
Image (Screen)	Moves the focus forwards	`Tab`
Image (Screen)	Moves the focus backwards	`Shift` + `Tab`
InputField (Input Field)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Navigates within the input field	`Arrow right` and `Arrow left`
	Places the text cursor (also known as the caret) before the first character in the input field	`Home`
	Places the text cursor after the last character in the input field	`End`
	Moves to the next word in the input field	`Ctrl` + `Arrow right`
	Moves to the previous word in the input field	`Ctrl` + `Arrow left`
	Selects the character immediately after the text cursor	`Shift` + `Arrow right`
	Selects the character immediately before the text cursor	`Shift` + `Arrow left`
	Selects the word immediately after the text cursor	`Ctrl` + `Shift` + `Arrow right`
	Selects the word immediately before the text cursor	`Ctrl` + `Shift` + `Arrow left`
	Selects the area between the text cursor and the end of the line	`Shift` + `End`
	Selects the area between the text cursor and the start of the line	`Shift` + `Home`
	Removes a selection	`Arrow right` or `Arrow left`
	Copies the selected text to the clipboard	`Ctrl` + `/` `Ctrl` + `Enter` on the numeric keypad)
	Cuts the selected text and copies it to the clipboard	`Ctrl` + `x` (alternatively: `Shift` + `Delete` on the numeric keypad)
	Pastes from the clipboard	`Ctrl` + `/` `Shift` + `Enter` on the numeric keypad)
	Opens or closes value help/F4 help	`Alt` + `Arrow down` / `Arrow up` or `F4`
	Starts editing	Enter a valid character
	Stops editing	`Tab`
	Deletes the character immediately after the text cursor	`Delete`
	Deletes the character immediately before the text cursor	`Backspace`
	Undoes the last entry	`Ctrl` + `z`
	Redoes the last entry	`Ctrl` + `y`
ItemListBox (List Entry)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves between the items in the list box	`Arrow up` and `Arrow down`
	Moves to the first item in the list box	`Home`
LinkToAction LinkToUrl (Link)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Activates the focused link	`Enter`
MenuBar (Menu Bar)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves between the items in the menu bar	`Arrow right` and `Arrow left`
	Moves to the first item in the menu bar	`Home`
	Moves to the last item in the menu bar	`End`
	Opens the menu of an item in the menu bar	`Arrow down`
	Navigates in the open menu	`Arrow keys`
	Selects the focused menu item	`Enter`
	Closes the current menu level	`Escape`
PhaseIndicator (Phase Display)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves between the phases	`Arrow right` and `Arrow left`
	Displays the focused phase	`Enter`
ProgressIndicator (Progress Display)	Moves the focus forwards	`Tab`
ProgressIndicator (Progress Display)	Moves the focus backwards	`Shift` + `Tab`
RadioButton (Radio Button) RadioButtonGroupByIndex RadioButtonGroupByKey (Group of Radio Buttons)	Moves the focus forwards (the focus first moves to the RadioButtonGroup (from outside the group) and then to the selected RadioButton)	`Tab`
	Moves the focus backwards (When moving backwards to the element, the focus first moves to the selected RadioButton element in the RadioButtonGroup (from outside the group).)	`Shift` + `Tab`
	Moves between the RadioButton elements within a RadioButtonGroup, moving the selection at the same time	`Arrow keys`
	Moves between the RadioButton elements within a RadioButtonGroup, without moving the selection at the same time	`Shift` + `Arrow keys`
	If the selection is not moved: Sets the selection on the focused RadioButton element, not the selected RadioButton element	`Space`
RoadMap (Roadmap, Process Flow Display)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves between the roadmap steps	`Arrow right` and `Arrow left`
	Activates the focused roadmap step	`Space`
ScrollContainer (Grouping Element)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Scrolls up one page in the focused element (if it is not an input element)	`Page Up`
	Scrolls down one page in the focused element (if it is not an input element)	`Page Down`
Table (Table)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves from cell to cell in the table (forwards, row by row)	`Tab`
	Moves from cell to cell in the table (backwards, row by row)	`Shift` + `Tab`
	Moves between cells in the table	`Arrow keys` Applies only if the focus is not on an editable cell. If the focus is on an editable cell, you move between the characters in the editable cell instead.
	Moves between the characters in an editable cell	`Arrow keys`
	Move forwards out of the table (group navigation)	`F6`
TabStrip (Tabstrip)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Activates the focused tab index and displays the related tab page	`Space`
	Moves between the tab indexes	`Arrow right` and `Arrow left`
	If tab pages are hidden: Displays the next tab page (pages forwards)	`Ctrl` + `Page Down`
	If tab pages are hidden: Displays the previous tab page (pages backwards)	`Ctrl` + `Page Up`
TextEdit (Text Input Field)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves the text cursor (also known as the caret) between the characters in a line	`Arrow right` and `Arrow left`
	Places the text cursor before the first character in the line	`Home`
	Places the text cursor after the last character in the line	`End`
	Moves vertically between the lines	`Arrow down` and `Arrow up`
	Deletes the character in front of the text cursor	`Backspace`
	Deletes the character after the text cursor	`Delete`
	Inserts a line break in the text	`Enter`
	Copies the selected characters from the text to the clipboard	`Ctrl` + `/` `Ctrl` + `Enter` on the numeric keypad)
	Cuts the selected characters from the text and copies them to the clipboard	`Ctrl` + `x` (alternatively: `Shift` + `Delete` on the numeric keypad)
	Pastes characters from the clipboard into the text	`Ctrl` + `/` `Shift` + `Enter` on the numeric keypad)
	Undoes the last action in the text	`Ctrl` + `z` (or `Alt` + `Backspace`)
	Redoes the last action in the text	`Ctrl` + `y`
	Selects the character immediately after the text cursor	`Shift` + `Arrow right`
	Selects the character immediately before the text cursor	`Shift` + `Arrow left`
	Selects the word immediately after the text cursor	`Ctrl` + `Shift` + `Arrow right`
	Selects the word immediately before the text cursor	`Ctrl` + `Shift` + `Arrow left`
	Selects the area between the text cursor and the end of the line	`Shift` + `End`
	Selects the area between the text cursor and the start of the line	`Shift` + `Home`
	Removes a selection	`Arrow keys`
	Scrolls up one page	`Page Up`
	Scrolls down one page	`Page Down`
	Moves directly to the first page	`Home`
	Moves directly to the last page	`End`
TextView (Text Display)	Moves the focus forwards	`Tab`
TextView (Text Display)	Moves the focus backwards	`Shift` + `Tab`
ToggleButton (Pushbutton to De-/Activate)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Enables or disables the focused element	`Space` or `Enter`
ToggleLink (Link to Show/Hide)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Opens or closes the focused link	`Space` or `Enter`
Tray (Grouping Element)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Expands the focused element	`+ on the numeric keypad`
	Collapses the focused element	`- on the numeric keypad`
Tree (Tree)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Moves down one node	`Arrow down`
	Moves up one node	`Arrow up`
	Expands a closed node	`Arrow right`
	Collapses an open node	`Arrow left`
TriStateCheckbox (Checkbox with triple status display)	Moves the focus forwards	`Tab`
	Moves the focus backwards	`Shift` + `Tab`
	Toggles between the three states of the focused element	`Space`