[!Note] Please note that this control has been deprecated and replaced with the Grid component, and as such, we recommend migrating to that control. This will not be receiving any new features, bug fixes will be deprioritized. For help or questions on migrating your codebase to the Data Grid, please contact support.
Web Components Seleção de grade
A Tabela de Dados/Grade de Dados Ignite UI for Web Components suporta a seleção de uma ou várias linhas e células.
Web Components Grid Selection Example
Visão geral
A seleção na grade de dados Web Components é habilitada em um nível de linha e célula e pode ser configurada usando a selectionMode
opção da grade Web Components. Esta propriedade tem cinco opções diferentes, listadas abaixo:
None
: Selection is not enabled.SingleCell
: Selection of a single cell is enabled.SingleRow
: Selection of a single row is enabled.MultipleCell
: Selection of multiple cells is enabled.MultipleRow
: Selection of multiple rows is enabled.RangeCell
: Selection of a range of multiple cells by clicking and dragging is enabled.
selectionBehavior
assume como padrão ModifierBased
, onde apenas uma linha ou célula é selecionada por vez e as teclas modificadoras (CTRL) são necessárias para selecionar vários itens. selectionBehavior
definido como Toggle
permitirá que várias linhas ou células sejam selecionadas com apenas um clique.
MultipleRow
includes the following functionality:
- Clique e arraste para selecionar linhas
- Pressione Shift e clique para selecionar várias linhas.
- Pressione Shift e as teclas de seta para cima/baixo para selecionar várias linhas.
Pressing the space bar toggles selection of active row via MultipleRow
or SingleRow
.
Row Range Selection
O exemplo a seguir demonstra como selecionar ou desselecionar todas as linhas na grade. Observe que selectionMode
deve ser definido como MultipleRow.