[!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 Grid Cell Activation
The Ignite UI for Web Components Data Table / Data Grid supports a cell activation feature that will enable keyboard navigation through the cells of the grid. This is activated by setting the activationMode property of the grid to Cell.
Web Components Grid Cell Activation Example
Excel Style Navigation
A propriedade enterBehaviorAfterEdit configurará a grade para navegar para a próxima célula para cima, para baixo, para a esquerda ou para a direita após a tecla enter ser pressionada no modo de edição. Caso contrário, a propriedade enterBehavior da grade pode ser usada para navegar para outras células, enquanto não estiver no modo de edição, para cima, para baixo, para a esquerda ou para a direita.
Keyboard Navigation
Após definir a propriedade activationMode da grade para Cell, isso habilitará uma gama de opções de navegação por teclado na grade de dados. Abaixo está uma descrição de cada um dos pressionamentos de tecla/combinações e o efeito que eles terão em relação à célula atualmente ativada:
- ↑: Navegar uma célula para cima.
- ↓: Navegar uma célula para baixo.
- ←: Navega uma célula para a esquerda somente na linha atual.
- →: Navega uma célula para a direita somente na linha atual.
- Page Up: Rola a grade uma página de visualização para cima.
- Page Down: Rola a grade uma página de visualização para baixo.
- Tab: move a célula ativa para a próxima célula à direita, ou para a célula mais à esquerda da próxima linha, se a última célula dessa linha for alcançada.
- Shift + Tab: move a célula ativa para a próxima célula à esquerda, ou para a célula mais à direita da linha anterior, se a primeira célula dessa linha for alcançada.
- Ctrl + ↑: Mover para a célula superior da coluna.
- Ctrl + ↓: Move para a célula inferior da coluna.
- Ctrl + ←: Mover para a célula mais à esquerda na linha.
- Ctrl + →: Mover para a célula mais à direita na linha.
- Ctrl + Home: Mover para a célula superior esquerda na grade.
- Ctrl + End: Mover para a célula inferior direita na grade.