Below are listed all the events of the grid you can listen to.
Add the relevant onXXX() method to the gridOptions or register a method via api.addEventListener(eventName, handler). You can also register events using Angular event binding eg (event-name)="myEventHandler".
|cellClicked||Cell is clicked.|
|cellDoubleClicked||Cell is double clicked.|
|cellFocused||Cell is focused.|
|rowClicked||Row is clicked.|
|rowDoubleClicked||Row is double clicked.|
|rowSelected||Row is selected or deselected.|
|selectionChanged||Row selection is changed. Use the grid API to get the new row selected.|
|cellContextMenu||Cell is right clicked.|
|rangeSelectionChanged||A change to range selection has occurred.|
|cellValueChanged||Value has changed after editing.|
|rowValueChanged||A cells value within a row has changed.|
|rowEditingStarted||Editing a row has started (when row editing is enabled). When row editing, this event will be fired
|rowEditingStopped||Editing a row has stopped (when row editing is enabled). When row editing, this event will be fired
|cellEditingStarted||Editing a cell has started.|
|cellEditingStopped||Editing a cell has stopped.|
|itemsAdded||Client added a new row.|
|itemsRemoved||Client removed a row.|
Sort & Filter
sortChanged -> Sort has changed, grid also listens for this and updates the model.
beforeSortChanged -> Sort has changed, grid has not updated.
afterSortChanged -> Sort has changed, grid has updated.
filterChanged -> Filter has changed, grid also listens for this and updates the model.
beforeFilterChanged -> Filter has changed, grid has not updated.
afterFilterChanged -> Filter has changed, grid has updated.
filterModified -> Gets called when filter has been modified, but grid not informed. Useful when using an apply button inside the filter.
|columnEverythingChanged||Shotgun - gets called when either a) new columns are set or b) columnApi.setState() is used, so everything has changed.|
|rowGroupOpened||A row group was opened or closed.|
|columnVisible||A column, or group of columns, was hidden / shown.|
|columnPinned||A column, or group of columns, was pinned / unpinned.|
|columnResized||A column was resized.|
|columnRowGroupChanged||A row group column was added or removed.|
|columnValueChanged||A value column was added or removed.|
|columnMoved||A column was moved. To find out when the column move is finished you can use the dragStopped event below.|
|columnGroupOpened||A column group was opened / closed.|
|virtualColumnsChanged||The list of rendered columns has changed (only columns in the visible scrolled viewport are rendered by default).|
|newColumnsLoaded||User has set in new columns.|
|columnPivotModeChanged||The pivot mode flag was changed|
|columnRowGroupChanged||A row group column was added, removed or order changed.|
|columnPivotChanged||A pivot column was added, removed or order changed.|
|gridColumnsChanged||The list of grid columns has changed.|
|displayedColumnsChanged||The list of displayed columns has changed, can result from columns open / close, column move, pivot, group, etc|
|paginationReset||Pagination service is reset.|
|paginationPageLoaded||Pagination page load is finished.|
|paginationPageRequested||Pagination page load is requested.|
|gridReady||ag-Grid has initialised. The name 'ready' was influenced by the authors time programming the Commodore 64. Use this event if, for example, you need to use the grid's API to fix the columns to size.|
|gridSizeChanged||The grid had to lay out again because it changed size.|
|modelUpdated||Displayed rows have changed. Happens following sort, filter or tree expand / collapse events.|
|floatingRowDataChanged||The client has set new floating data into the grid|
|virtualRowRemoved||A row was removed from the dom, for any reason. Use to clean up resources (if any) used by the row.|
|viewportChanged||Informs when rows rendered into the DOM changes.|
|bodyScroll||Informs when the body is scrolled horizontally or vertically.|
|dragStarted, dragStopped||When column dragging starts or stops. Useful if you want to wait until after a drag event before doing an action.|
|rowDataChanged||The client has set new data into the grid|