React Data Grid Handsontable cell type
Add a spreadsheet editor in a popup, by using the Handsontable cell type.
HOT-in-HOT opens by any of the following:
- F2 or Enter key is pressed while the cell is selected
- The triangle icon is clicked
- The cell content is double clicked
While HOT-in-HOT is opened, the text field above the HOT-in-HOT remains focused at all times.
Keyboard bindings while the HOT-in-HOT is opened:
- Escape - close editor and cancel change.
- Enter - close editor and apply change*, move the selection in the main HOT downwards or according to the
- Tab - behaves as the Enter key, but move the selection in the main HOT to the right or to the left (depending on your
layoutDirectionsetting) or according to the
- Arrow Down - move the selection in HOT-in-HOT downwards. If the last row was selected, this has no effect.
- Arrow Up - move the selection in HOT-in-HOT upwards. If the first row was selected, deselect. If HOT-in-HOT was deselected, behave as the Enter key but move the selection in the main HOT upwards.
- Arrow Right - move the text cursor in the text field to the left. If the text cursor was at the start position, behave as the Enter key but move the selection in the main HOT to the left.
- Arrow Left - move the text cursor in the text field to the right. If the text cursor was at the end position, behave as the TAB key.
Related API reference
- Configuration options:
- Core methods: