React Data GridGrid Events Reference

To listen to events see Grid Events.

Accessories

toolPanelVisibleChangedCopy Link
ToolPanelVisibleChangedEvent
The tool panel visibility has changed. Fires twice if switching between panels - once with the old panel and once with the new panel.
toolPanelSizeChangedCopy Link
ToolPanelSizeChangedEvent
The tool panel size has been changed.
columnMenuVisibleChangedCopy Link
ColumnMenuVisibleChangedEvent
The column menu visibility has changed. Fires twice if switching between tabs - once with the old tab and once with the new tab.
contextMenuVisibleChangedCopy Link
ContextMenuVisibleChangedEvent
The context menu visibility has changed (opened or closed).

Clipboard

See Clipboard for more information.

cutStartCopy Link
CutStartEvent
Cut operation has started.
cutEndCopy Link
CutEndEvent
Cut operation has ended.
pasteStartCopy Link
PasteStartEvent
Paste operation has started.
pasteEndCopy Link
PasteEndEvent
Paste operation has ended.

Columns

columnVisibleCopy Link
ColumnVisibleEvent
A column, or group of columns, was hidden / shown.
columnPinnedCopy Link
ColumnPinnedEvent
A column, or group of columns, was pinned / unpinned.
columnResizedCopy Link
ColumnResizedEvent
A column was resized.
columnMovedCopy Link
ColumnMovedEvent
A column was moved.
columnValueChangedCopy Link
ColumnValueChangedEvent
A value column was added or removed.
columnPivotModeChangedCopy Link
ColumnPivotModeChangedEvent
The pivot mode flag was changed.
columnPivotChangedCopy Link
ColumnPivotChangedEvent
A pivot column was added, removed or order changed.
columnGroupOpenedCopy Link
ColumnGroupOpenedEvent
A column group was opened / closed.
newColumnsLoadedCopy Link
NewColumnsLoadedEvent
User set new columns.
gridColumnsChangedCopy Link
GridColumnsChangedEvent
The list of grid columns changed.
displayedColumnsChangedCopy Link
DisplayedColumnsChangedEvent
The list of displayed columns changed. This can result from columns open / close, column move, pivot, group, etc.
virtualColumnsChangedCopy Link
VirtualColumnsChangedEvent
The list of rendered columns changed (only columns in the visible scrolled viewport are rendered by default).
columnHeaderMouseOverCopy Link
ColumnHeaderMouseOverEvent
A mouse cursor is initially moved over a column header.
columnHeaderMouseLeaveCopy Link
ColumnHeaderMouseLeaveEvent
A mouse cursor is moved out of a column header.
columnHeaderClickedCopy Link
ColumnHeaderClickedEvent
A click is performed on a column header.
columnHeaderContextMenuCopy Link
ColumnHeaderContextMenuEvent
A context menu action, such as right-click or context menu key press, is performed on a column header.
pivotMaxColumnsExceededCopy Link
PivotMaxColumnsExceededEvent
Exceeded the pivotMaxGeneratedColumns limit when generating columns.

Components

See Components for more information.

componentStateChangedCopy Link
ComponentStateChangedEvent
Only used by Angular, React and VueJS AG Grid components (not used if doing plain JavaScript). If the grid receives changes due to bound properties, this event fires after the grid has finished processing the change.

Editing

See Cell Editing for more information.

cellValueChangedCopy Link
CellValueChangedEvent
Cell value has changed. This occurs after the following scenarios:
  • Editing. Will not fire if any of the following are true:
  • new value is the same as old value; readOnlyEdit = true; editing was cancelled (e.g. Escape key was pressed); or new value is of the wrong cell data type for the column.
  • Cut.
  • Paste.
  • Cell clear (pressing Delete key).
  • Fill handle.
  • Copy range down.
  • Undo and redo.
  • cellEditRequestCopy Link
    CellEditRequestEvent
    Value has changed after editing. Only fires when readOnlyEdit=true.
    rowValueChangedCopy Link
    RowValueChangedEvent
    A cell's value within a row has changed. This event corresponds to Full Row Editing only.
    cellEditingStartedCopy Link
    CellEditingStartedEvent
    Editing a cell has started.
    cellEditingStoppedCopy Link
    CellEditingStoppedEvent
    Editing a cell has stopped.
    rowEditingStartedCopy Link
    RowEditingStartedEvent
    Editing a row has started (when row editing is enabled). When row editing, this event will be fired once and cellEditingStarted will be fired for each individual cell. Only fires when doing Full Row Editing.
    rowEditingStoppedCopy Link
    RowEditingStoppedEvent
    Editing a row has stopped (when row editing is enabled). When row editing, this event will be fired once and cellEditingStopped will be fired for each individual cell. Only fires when doing Full Row Editing.
    undoStartedCopy Link
    UndoStartedEvent
    Undo operation has started.
    undoEndedCopy Link
    UndoEndedEvent
    Undo operation has ended.
    redoStartedCopy Link
    RedoStartedEvent
    Redo operation has started.
    redoEndedCopy Link
    RedoEndedEvent
    Redo operation has ended.
    cellSelectionDeleteStartCopy Link
    CellSelectionDeleteStartEvent
    Cell selection delete operation (cell clear) has started.
    cellSelectionDeleteEndCopy Link
    CellSelectionDeleteEndEvent
    Cell selection delete operation (cell clear) has ended.

    Filtering

    See Filtering for more information.

    filterOpenedCopy Link
    FilterOpenedEvent
    Filter has been opened.
    filterChangedCopy Link
    FilterChangedEvent
    Filter has been modified and applied.
    filterModifiedCopy Link
    FilterModifiedEvent
    Filter was modified but not applied. Used when filters have 'Apply' buttons.
    advancedFilterBuilderVisibleChangedCopy Link
    AdvancedFilterBuilderVisibleChangedEvent
    Advanced Filter Builder visibility has changed (opened or closed).

    Find

    See Find for more information.

    findChangedCopy Link
    FindChangedEvent
    Find details have changed (e.g. Find search value, active match, or updates to grid cells).

    Integrated Charts

    See Integrated Charts Events for more information.

    chartCreatedCopy Link
    ChartCreatedEvent
    A chart has been created.
    chartRangeSelectionChangedCopy Link
    ChartRangeSelectionChangedEvent
    The data range for the chart has been changed.
    chartOptionsChangedCopy Link
    ChartOptionsChangedEvent
    Formatting changes have been made by users through the Customize Panel.
    chartDestroyedCopy Link
    ChartDestroyedEvent
    A chart has been destroyed.

    Keyboard Navigation

    See Keyboard Navigation for more information.

    cellKeyDownCopy Link
    CellKeyDownEvent | FullWidthCellKeyDownEvent
    DOM event keyDown happened on a cell.

    Miscellaneous

    gridReadyCopy Link
    GridReadyEvent
    The grid has initialised and is ready for most api calls, but may not be fully rendered yet
    gridPreDestroyedCopy Link
    GridPreDestroyedEvent
    Invoked immediately before the grid is destroyed. This is useful for cleanup logic that needs to run before the grid is torn down.
    firstDataRenderedCopy Link
    FirstDataRenderedEvent
    Fired the first time data is rendered into the grid. Use this event if you want to auto resize columns based on their contents
    gridSizeChangedCopy Link
    GridSizeChangedEvent
    The size of the grid div has changed. In other words, the grid was resized.
    modelUpdatedCopy Link
    ModelUpdatedEvent
    Displayed rows have changed. Triggered after sort, filter or tree expand / collapse events.
    virtualRowRemovedCopy Link
    VirtualRowRemovedEvent
    A row was removed from the DOM, for any reason. Use to clean up resources (if any) used by the row.
    viewportChangedCopy Link
    ViewportChangedEvent
    Which rows are rendered in the DOM has changed.
    bodyScrollCopy Link
    BodyScrollEvent
    The body was scrolled horizontally or vertically.
    bodyScrollEndCopy Link
    BodyScrollEndEvent
    Main body of the grid has stopped scrolling, either horizontally or vertically.
    dragStartedCopy Link
    DragStartedEvent
    When dragging starts. This could be any action that uses the grid's Drag and Drop service, e.g. Column Moving, Column Resizing, Range Selection, Fill Handle, etc.
    dragStoppedCopy Link
    DragStoppedEvent
    When dragging stops. This could be any action that uses the grid's Drag and Drop service, e.g. Column Moving, Column Resizing, Range Selection, Fill Handle, etc.
    stateUpdatedCopy Link
    StateUpdatedEvent
    Grid state has been updated.

    Pagination

    See Row Pagination for more information.

    paginationChangedCopy Link
    PaginationChangedEvent

    Triggered every time the paging state changes. Some of the most common scenarios for this event to be triggered are:

    • The page size changes
    • The current shown page is changed
    • New data is loaded onto the grid

    Row Drag and Drop

    See Row Dragging for more information.

    rowDragEnterCopy Link
    RowDragEnterEvent
    A drag has started, or dragging was already started and the mouse has re-entered the grid having previously left the grid.
    rowDragMoveCopy Link
    RowDragMoveEvent
    The mouse has moved while dragging.
    rowDragLeaveCopy Link
    RowDragLeaveEvent
    The mouse has left the grid while dragging.
    rowDragEndCopy Link
    RowDragEndEvent
    The drag has finished over the grid.
    rowDragCancelCopy Link
    RowDragCancelEvent
    The drag has been cancelled over the grid.

    Row Grouping

    See Row Grouping for more information.

    columnRowGroupChangedCopy Link
    ColumnRowGroupChangedEvent
    A row group column was added, removed or reordered.
    rowGroupOpenedCopy Link
    RowGroupOpenedEvent
    A row group was opened or closed.
    expandOrCollapseAllCopy Link
    ExpandOrCollapseAllEvent
    Fired when calling either of the API methods expandAll() or collapseAll().

    Row Pinning

    See Row Pinning for more information.

    pinnedRowDataChangedCopy Link
    PinnedRowDataChangedEvent
    The client has set new pinned row data into the grid.
    pinnedRowsChangedCopy Link
    PinnedRowsChangedEvent
    A row has been pinned to top or bottom, or unpinned.

    RowModel: Client-Side

    rowDataUpdatedCopy Link
    RowDataUpdatedEvent
    Client-Side Row Model only. The client has updated data for the grid by either a) setting new Row Data or b) Applying a Row Transaction.
    asyncTransactionsFlushedCopy Link
    AsyncTransactionsFlushedEvent
    Async transactions have been applied. Contains a list of all transaction results.

    RowModel: Server-Side

    See Server-Side Row Model for more information.

    storeRefreshedCopy Link
    StoreRefreshedEvent
    A server side store has finished refreshing.

    Selection

    headerFocusedCopy Link
    HeaderFocusedEvent
    Header is focused.
    cellClickedCopy Link
    CellClickedEvent
    Cell is clicked.
    cellDoubleClickedCopy Link
    CellDoubleClickedEvent
    Cell is double clicked.
    cellFocusedCopy Link
    CellFocusedEvent
    Cell is focused.
    cellMouseOverCopy Link
    CellMouseOverEvent
    Mouse entered cell.
    cellMouseOutCopy Link
    CellMouseOutEvent
    Mouse left cell.
    cellMouseDownCopy Link
    CellMouseDownEvent
    Mouse down on cell.
    rowClickedCopy Link
    RowClickedEvent
    Row is clicked.
    rowDoubleClickedCopy Link
    RowDoubleClickedEvent
    Row is double clicked.
    rowSelectedCopy Link
    RowSelectedEvent
    Row is selected or deselected. The event contains the node in question, so call the node's isSelected() method to see if it was just selected or deselected.
    selectionChangedCopy Link
    SelectionChangedEvent
    Row selection is changed. Use the selectedNodes field to get the list of selected nodes at the time of the event. When using the SSRM, selectedNodes will be null when selecting all nodes. Instead, refer to the serverSideState field.
    cellContextMenuCopy Link
    CellContextMenuEvent
    Cell is right clicked.
    cellSelectionChangedCopy Link
    CellSelectionChangedEvent
    A change to cell selection has occurred.
    fillStartCopy Link
    FillStartEvent
    Fill operation has started.
    fillEndCopy Link
    FillEndEvent
    Fill operation has ended.

    Sorting

    See Row Sorting for more information.

    sortChangedCopy Link
    SortChangedEvent
    Sort has changed. The grid also listens for this and updates the model.

    Tooltips

    See Tooltip Component for more information.

    tooltipShowCopy Link
    TooltipShowEvent
    A tooltip has been displayed
    tooltipHideCopy Link
    TooltipHideEvent
    A tooltip was hidden