ag-grid : how to get old value and new value in ag-grid when column in editable

Question

I am using ag-grid along with angular 8.

with the code given below, I am able to render the data on the grid where first three columns are editable and in fourth column I have a update button.

now on click of update button. I have to send the old value of all three editable column value as well as the new value so that I can update the same in backend.

but I am not sure how to get the old value as well as new value from edited grid.

this.service.getData().subscribe((data) => {
        this.columnheaders = (Object.keys(data[0]));
        this.rows = data;
        for (var x in this.columnheaders)
          this.columns[x] = { headerName: this.columnheaders[x], field: this.columnheaders[x], editable: true };
        this.columns[3] = {
          headerName: 'Update', cellRenderer: function (params) {
            var eCell = document.createElement('span');
            eCell.innerHTML = '<button>Update</button>';
            return eCell;
          }
        };

      });

sandeep joshi sandeep joshi · Accepted Answer · 2020-09-05T10:05:19

you can listen to below events and save old values in some variable/object which you can use while doing button click.

onCellEditingStarted: function(event) {
var oldCellValue = event.value; // save this value by attaching it to button or some variable
console.log('cellEditingStarted');
},


onCellEditingStopped: function(event) {
var editedCellValue = event.value;
console.log('cellEditingStopped');
},

ag-grid : how to get old value and new value in ag-grid when column in editable

1 Answers