Add unique id to every row using ag-Grid

Question

I used the ag-Grid plugin in javascript for my grid. My problem is figuring out how I can update the rows into database. How can I set a unique id to every row?

<div id="myGrid" style="height: 600px;" class="ag-theme-balham"></div>

    <script type="text/javascript" charset="utf-8">
        // specify the columns
        var columnDefs = [
            {headerName: "Make", field: "make"},
            {headerName: "Model", field: "model"},
            {headerName: "Price", field: "price"}
        ];

        // specify the data
        var rowData = [
            {make: "Toyota", model: "Celica", price: 'test', my_unique_id: '123'},
            {make: "Ford", model: "Mondeo", price: 32000, my_unique_id: '42341'},
            {make: "Porsche", model: "Boxter", price: 72000, my_unique_id: '567'}
        ];

        // let the grid know which columns and what data to use
        var gridOptions = {
            columnDefs: columnDefs,
            rowData: rowData
        };

        // lookup the container we want the Grid to use
        var eGridDiv = document.querySelector('#myGrid');

        // create the grid passing in the div to use together with the columns & data we want to use
        new agGrid.Grid(eGridDiv, gridOptions);
    </script>

Answer 1

On the definition of your columns columnDefs you need to add the key and, if you need, set hide: true to this data not appears on UI

 var columnDefs = [
            {headerName: "Make", field: "make"},
            {headerName: "Model", field: "model"},
            {headerName: "Price", field: "price"}, 
            {headerName: "Key", field: "my_unique_id", hide = true}, 
 ];

See all properties for columns on ag-grid docs here: https://www.ag-grid.com/javascript-grid-column-properties/

Answer 2

I am not sure if you are aware of this, but ag-grid actually assigns a unique ID to every row, when the row data is set.

On of the ways to access the id for each row node would be to use the forEachNode() method, as specified within the ag-grid gridOptions API documentation . forEachNode() iterates all rows, and returns the data for each row.

Assuming you are using Vanilla JavaScript (without any frameworks such as React or Angular), you do the following to get the id

 gridOptions.api.forEachNode(node => {
   console.log(node.id);
   // do the rest
 });

Answer 3

 {
    headerName: "Num",
    field: "id",
    filter: true,
    width: 150,
    cellRendererFramework:(params)=>{
      return <span>{params.rowIndex}</span>
    }
  },