React Data Grid: Grid Events

This is a list of the events that the grid raises.

Provide your event handler to the relevant React Prop on the AgGridReact component.

const onCellClicked = (params: CellClickedEvent) => console.log('Cell was clicked');

<AgGridReact onCellClicked={onCellClicked}> </AgGridReact>

React Hooks

When adding event listeners, you can optionally use useCallback. See React Hooks for best practices on using React Hooks with the grid.

Registering via Grid Options

Registering the event onto the grid component as shown above is the recommendey way. However additionally a callback can be put on the Grid Options, if you are using a Grid Options object. The name of the callback is constructed by prefixing the event name with on. For example, the callback for the cellClicked event is gridOptions.onCellClicked.

const gridOptions = {
    // Add event handlers
    onCellClicked: (event: CellClickedEvent) => console.log('Cell was clicked'),
}

List of Events

The following are all events emitted by the grid. If using TypeScript, you can reference the interface for each event.