You can target updates to a single row or cell. Updating a single row means asking the grid to replace the data item for one specific row. Updating a cell means keeping the data item but asking the grid to replace one attribute of that data item.
Both single row and single cell updates are done by first getting a reference to the row's Row Node and then using the relevant Row Node API method. See Accessing Data on how to access Row Nodes. Once you have access to the required Row Node, you can update its data with the following Row Node API methods:
Updates the data on the rowNode. When this method is called, the grid refreshes the entire rendered row if it is displayed. |
Replaces the data on the rowNode. When this method is called, the grid refreshes the entire rendered row if it is displayed. |
Sets the value on the rowNode for the specified column and refreshes the rendered cell. In Read Only mode, this fires onCellEditRequest instead of writing directly. In Pivot Mode, pivot columns on leaf rows resolve to their underlying value column. The eventSource parameter controls how the value is written |
Returns the data value from the rowNode for the specified column. By default, returns committed data ignoring any pending edits. For group rows, returns aggregated values or the group key. For formula cells, returns the computed result. To get the displayed value (with formatting and value formatter applied), use api.getCellValue() instead. In Pivot Mode, pivot columns on leaf rows resolve to their underlying value column. The from parameter controls value resolution. |
Reading Cell Values Copy Link
There are two ways to read cell values:
rowNode.getDataValue(colKey)— returns the underlying data value for a column. This includes resolved valueGetters, aggregation on group rows, and computed formulas, but excludes any pending edits. Use this when you need the raw data (e.g. for calculations or external updates).api.getCellValue({ rowNode, colKey })— returns the display value as shown in the grid, including pending edits and group column display logic. PassuseFormatter: trueto get the formatted string. Use this when you need the value as the user sees it.
Both methods accept an optional from parameter to control how pending edits are resolved — see Batch Editing - Reading Values for details.
View Refresh Copy Link
After calling rowNode.setData, rowNode.updateData or rowNode.setDataValue, the grid's view automatically refreshes to reflect the change. There is no need to manually request a refresh.
The main difference between setData and updateData is that setData always refreshes every cell, whereas updateData only refreshes cells whose values have changed. Additionally, setData does not cause changed cells to flash when ColDef.enableCellChangeFlash = true.
Sort / Filter / Group Refresh Copy Link
After calling rowNode.setData, rowNode.updateData or rowNode.setDataValue the grid does not update to reflect a change in sorting, filtering or grouping.
To have the grid update its sort, filter or grouping call the Grid API refreshClientSideRowModel().
If you want the grid to automatically update sorting, filter or grouping then you should consider using Transaction Updates.
Updating Rows / Cells Example Copy Link
The example below demonstrates the following:
Set Price on Toyota: The price value is updated on the Toyota row and the grid refreshes the cell.
Set Data on Ford: The entire data is set on the Ford row and the grid refreshes the entire row. Updated cells do not flash (even though
enableCellChangeFlash = true).Update Data on Ford: The entire data is updated on the Ford row and the grid refreshes the changed values in the row. Updated cells flash (as
enableCellChangeFlash = true).Sort: Re-runs the sort in the Client-Side Row Model - to see this in action, sort the data first, then edit the data so the sort is broken, then hit this button to fix the sort.
Filter: Re-runs the filter in the Client-Side Row Model - to see this in action, filter the data first, then edit the data so the filter is broken (i.e. a row is present that should not be present), then hit this button to fix the filter.