Adding rows one by one instead of using rowData list in ag-grid

Question

I am using Papaparse's step property[1] to parse a big CSV file and then display it in a tabular format using ag-grid[2]. The issue is rowdata property of ag-grid a list of objects. So I have to wait till all my items are fetched and then I append them to my rowdata list using setState.

Papa.parse("https://shru*****azonaws.com/test/OlymicData.csv", {
 download: true,
 dynamicTyping: true,
 step: this.updateData,
 header: true,
 complete: function(){
  console.log("over")
 }
 });

}

updateData(result) {
const data = result.data;
console.log("data is: ")
console.log(data)//this is a single row

list.push(data)
console.log("list is: ")


}

Question: Is there a way to add a row one by one in ag grid, instead waiting to get all the rows from csv and then appending them in a list and then using setState for rowData.

[1] https://www.papaparse.com/docs [2] https://www.ag-grid.com/react-grid/

Alexander Zbinden Alexander Zbinden · Accepted Answer · 2020-08-10T09:09:31

Adding single (or multiple) items can be accomplished through the applyTransaction method:

this.grid.api.applyTransaction({ add: [yourObject] );

For reference:

https://www.ag-grid.com/javascript-grid-data-update-transactions/

Adding rows one by one instead of using rowData list in ag-grid

1 Answers