To listen to events see Grid Events.
Accessories
The tool panel visibility has changed. Fires twice if switching between panels - once with the old panel and once with the new panel. |
The tool panel size has been changed. |
The column menu visibility has changed. Fires twice if switching between tabs - once with the old tab and once with the new tab. |
The context menu visibility has changed (opened or closed). |
Clipboard
See Clipboard for more information.
Cut operation has started. |
Cut operation has ended. |
Paste operation has started. |
Paste operation has ended. |
Columns
A column, or group of columns, was hidden / shown. |
A column, or group of columns, was pinned / unpinned. |
A column was resized. |
A column was moved. |
A value column was added or removed. |
The pivot mode flag was changed. |
A pivot column was added, removed or order changed. |
A column group was opened / closed. |
User set new columns. |
The list of grid columns changed. |
The list of displayed columns changed. This can result from columns open / close, column move, pivot, group, etc. |
The list of rendered columns changed (only columns in the visible scrolled viewport are rendered by default). |
A mouse cursor is initially moved over a column header. |
A mouse cursor is moved out of a column header. |
A click is performed on a column header. |
A context menu action, such as right-click or context menu key press, is performed on a column header. |
Exceeded the pivotMaxGeneratedColumns limit when generating columns. |
Components
See Components for more information.
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.
Value has changed after editing (this event will not fire if editing was cancelled, eg ESC was pressed) or
if cell value has changed as a result of cut, paste, cell clear (pressing Delete key),
fill handle, copy range down, undo and redo. |
Value has changed after editing. Only fires when readOnlyEdit=true . |
A cell's value within a row has changed. This event corresponds to Full Row Editing only. |
Editing a cell has started. |
Editing a cell has stopped. |
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. |
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. |
Undo operation has started. |
Undo operation has ended. |
Redo operation has started. |
Redo operation has ended. |
Cell selection delete operation (cell clear) has started. |
Cell selection delete operation (cell clear) has ended. |
Filtering
See Filtering for more information.
Filter has been opened. |
Filter has been modified and applied. |
Filter was modified but not applied. Used when filters have 'Apply' buttons. |
Advanced Filter Builder visibility has changed (opened or closed). |
Integrated Charts
See Integrated Charts Events for more information.
A chart has been created. |
The data range for the chart has been changed. |
Formatting changes have been made by users through the Customize Panel. |
A chart has been destroyed. |
Keyboard Navigation
See Keyboard Navigation for more information.
DOM event keyDown happened on a cell. |
Miscellaneous
The grid has initialised and is ready for most api calls, but may not be fully rendered yet |
Invoked immediately before the grid is destroyed. This is useful for cleanup logic that needs to run before the grid is torn down. |
Fired the first time data is rendered into the grid. Use this event if you want to auto resize columns based on their contents |
The size of the grid div has changed. In other words, the grid was resized. |
Displayed rows have changed. Triggered after sort, filter or tree expand / collapse events. |
A row was removed from the DOM, for any reason. Use to clean up resources (if any) used by the row. |
Which rows are rendered in the DOM has changed. |
The body was scrolled horizontally or vertically. |
Main body of the grid has stopped scrolling, either horizontally or vertically. |
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. |
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. |
Grid state has been updated. |
Pagination
See Row Pagination for more information.
Triggered every time the paging state changes. Some of the most common scenarios for this event to be triggered are:
|
Row Drag and Drop
See Row Dragging for more information.
A drag has started, or dragging was already started and the mouse has re-entered the grid having previously left the grid. |
The mouse has moved while dragging. |
The mouse has left the grid while dragging. |
The drag has finished over the grid. |
The drag has been cancelled over the grid. |
Row Grouping
See Row Grouping for more information.
A row group column was added, removed or reordered. |
A row group was opened or closed. |
Fired when calling either of the API methods expandAll() or collapseAll() . |
Row Pinning
See Row Pinning for more information.
The client has set new pinned row data into the grid. |
RowModel: Client-Side
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. |
Async transactions have been applied. Contains a list of all transaction results. |
RowModel: Server-Side
See Server-Side Row Model for more information.
A server side store has finished refreshing. |
Selection
Header is focused. |
Cell is clicked. |
Cell is double clicked. |
Cell is focused. |
Mouse entered cell. |
Mouse left cell. |
Mouse down on cell. |
Row is clicked. |
Row is double clicked. |
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. |
Row selection is changed. Use the grid API getSelectedNodes() or getSelectedRows() to get the new list of selected nodes / row data. |
Cell is right clicked. |
A change to cell selection has occurred. |
Fill operation has started. |
Fill operation has ended. |
Sorting
See Row Sorting for more information.
Sort has changed. The grid also listens for this and updates the model. |