Selection provides an interactive support to highlight the row or cell
that you select. Selection can be done through a simple Mouse down or
Keyboard interaction. To enable selection, set{" "}
allowSelection as true.
Tree Grid supports two types of selection which can be set using
selectionSettings->type property. They are,
single - Enabled by default. Allows the user to select
single row/cell at a time.
multiple - Allows the user to select more than one
row/cell at a time.
Also, supports three modes of selection which can be set using
selectionSettings->mode property. They are,
Row - Enabled by default. Enables row selection in Tree
Grid.
Cell - Enables cell selection in Tree Grid.
Both - Enables both row and cell selection in Tree
Grid. Clicking any cell will select both the row and cell
simultaneously.
The Tree Grid supports two types of cell selection mode that can be
set by using the
selectionSettings->cellSelectionMode property. They
are,
Flow - The Flow value is set by default. The range of
cells are selected between the start index and end index that
includes in between cells of rows.
Box - Range of cells are selected from the start and
end column indexes that includes in between cells of rows within the
range.
To perform the multi-selection, hold CTRL key and click the desired rows/cells. To select range of rows/cells, hold{" "} SHIFT key and click the rows/cells.
While using the Tree Grid in a touch device environment, there is an option for multi-selection through single tap on the row and it will show a popup with the multi-selection symbol. Tap the icon to enable multi-selection in a single tap.
In this demo, enter the values in the Start and To text box to select range of rows. And click the Clear Selection button to deselect the rows.
More information on the selection configuration can be found in this documentation section.