grouping - Hide empty group in Ag-grid after row update

Question

How to remove empty groups from ag-grid after updateRowData. In the plnkr example, I am modifying country value for the row, I expect group name to be changed but instead a new group is created.

Code for modifying country name:

let toBeUpdate = [];

this.gridApi.forEachNode((rowNode, index) => {
  if(rowNode.data && rowNode.data.athlete == 'Sadiq Khoja'){

    var data = rowNode.data;
    data.country = 'AAA Unknown X';
    toBeUpdate.push(data);
  }
});

this.gridApi.updateRowData({update:toBeUpdate});

https://plnkr.co/edit/PTuwR5zejS2xiLIg

(Press 'Add' button to change the country name)

question from:https://stackoverflow.com/questions/65601123/hide-empty-group-in-ag-grid-after-row-update

Answer 1

UpdateRowData works when there is no row group. In this case, instead of using updateRowData try using setRowData - this.gridApi.setRowData(toBeUpdate);

This will also refresh the grid to reflect the changes in the row.

For more information you can read here - https://www.ag-grid.com/documentation/javascript/data-update/