Ativação de células React Grid
The Ignite UI for React 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.
React Grid Cell Activation Example
Excel Style Navigation
enterBehaviorAfterEdit property will configure the grid to navigate to the next cell up, down, left or right after the enter key is pressed in edit mode. Otherwise, the enterBehavior property of the grid can be used to navigate to other cells, while not in edit mode, up, down, left or right.
Keyboard Navigation
After setting the activationMode property of the grid to Cell, this will enable a range of keyboard navigation options in the data grid. Below is a description of each of the key presses / combinations and the effect they will have relative to the currently activated cell:
- ↑: 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: Role a grade uma página da janela de visualização para cima.
- PAGE DOWN: Role a grade uma página da janela de visualização para baixo.
- TAB: Mova 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: Mova 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 + ↑: Mova para a célula superior da coluna.
- CTRL + ↓: Mova para a célula inferior da coluna.
- CTRL + ←: Mova para a célula mais à esquerda da linha.
- CTRL + →: Mova para a célula mais à direita da linha.
- CTRL + HOME: Mova para a célula superior esquerda da grade.
- CTRL + END: Mova para a célula inferior direita da grade.