This article describes the available navigation and selection options when working with a Tabular Grid control (included in a Panel object).
There are several cases that involve:
- Using the keyboard.
- Using the mouse.
- Touching.
When using the keyboard, the Tabular Grid control can receive the focus by pressing the TAB key. Then, it is possible to browse through its rows using the following keys:
- Arrows
- Home / End
- Page Up / Page Down
By pressing the space bar on the row where you are positioned, the row is selected.
In addition, for each row you will see a checkbox. The checkbox allows selecting specific lines with the mouse.
You can change the selected row in a Tabular Grid with either a single selection (one row at a time) or with multiple selection (several rows at a time). To do so::
- Using the mouse, click on the row.
- Using the keyboard, browse with the arrow keys to the row and press the space bar.
- Using touch, tap on the row. In the case of a multiple selection, take into account the following considerations:
- If there is a selection column (checkbox), tapping a row clears the previous one.
- If there is no selection column (checkbox), touching a row adds it to the selection.
To do so:
- Using the mouse, press and hold the CTRL key, and then click on the row.
- Using the keyboard, browse with the arrow keys to the row, press and hold the CTRL key, and then press the space bar.
- Using touch:
- If there is a selection column (checkbox), tap on the checkbox.
- If there is no selection column (checkbox), touch the row you want to add/remove from the selection.
To do so:
- With the mouse:
- Click and hold a row, and then move the mouse to the end row.
- Click on the first row, press and hold the SHIFT key, and then click on the last row.
Note: If the CTRL key is also pressed, the range is added to the current selection.
- With the keyboard:
- Browse with the arrow keys to the start row, press and hold SHIFT, and then move with the arrow keys to the end row.
- Browse with the arrow keys to the start row. Next, select it with the space bar, browse to the end row, press and hold the SHIFT key, and then press the space bar.
Notes:
- If the CTRL key is also pressed, the range is added to the current selection.
- If the range was already selected, then the range is cleared.
- With touch, it is not possible to select ranges with a shortcut. Instead, you have to add them one by one.
If you have a selection column with a checkbox, you can select/clear all with the checkbox in the column header.
Whenever the selection changes, the SelectionChanged Event is triggered.
The Default Action is triggered when the following occurs:
- With the mouse, you click on a row (it doesn't matter if you are pressing CTRL or SHIFT).
- With the keyboard, you press the space bar over a row (it doesn't matter if you are pressing CTRL or SHIFT).
- With touch, by tapping a row.
Note: Clicking or tapping the selection checkbox does NOT trigger the Default Action.
Generators: Angular
Controls: Tabular Grid
Since GeneXus 18 Upgrade 9.
Enable Multiple Selection property
Selection Type property
gx-grid-focused-row-class property
gx-grid-row-class property
gx-grid-selected-row-class property
gx-grid-hover-row-class property