Search

React Data GridSSRM - Single Row Updates

Enterprise

This section demonstrates updating rows directly while using the Server-Side Row Model (SSRM).

Updating Rows API

You can update a single row by using the row node updateData or setData functions.

updateData
Function
Updates the data on the rowNode. When this method is called, the grid will refresh the entire rendered row if it is displayed.
setData
Function
Replaces the data on the rowNode. When this method is called, the grid will refresh the entire rendered row if it is displayed.

Setting row data will NOT change the row node ID, so if you are using getRowId() and the data changes such that the ID will be different, the rowNode will not have its ID updated.

Updating Rows Example

The example below demonstrates a basic example, using the API's forEachNode function to iterate over all loaded nodes, and updating their version.

  • Set Data: Sets the row data using setData and the grid refreshes the row, notably the cells won't flash with enableCellChangeFlash.

  • Update Data: Updates the row data using updateData and the grid refreshes the row, notably the cells do flash with enableCellChangeFlash.

Specific Row Updates

The following code snippet outlines the general approach of iterating through all loaded row nodes and then updating target rows with rowNode.updateData(data):

gridApi.forEachNode(rowNode => {
    if (idsToUpdate.indexOf(rowNode.data.id) >= 0) {
        // arbitrarily update some data
        const updated = rowNode.data;
        updated.gold += 1;

        // directly update data in rowNode
        rowNode.updateData(updated);
    }
});

The example below demonstrates this snippet in action;

Selected Row Updates

The example below demonstrates how to update all of the rows which the user has selected, note the following:

  • The Update Selected Rows button will update the row version directly on the selected row nodes.
  • The selected nodes are obtained using the api.getSelectedNodes() api, and are then individually updated.

Next Up

Continue to the next section to learn how to use Transactions with the SSRM.