applyTransaction remove not working with id

user_4299926 0
Viewed 2828

I'm using ag-grid in Angular9 project. I'm using Transactions to do CRUD operations in grid when my backend request resolve. I need to provide RowNodeId myself, i dont want to use object-references as i have large data set.

Thing is, i've provided the ID and i can add/update item in the grid but i'm unable to delete the item. In Doc it mentions, you only need to provide id to remove the item but i'm getting the following error.

enter image description here

Here's the code.

class HostAppListPage
{

@ViewChild('agGrid', {static: true}) grid:AgGridAngular;


constructor()
{
}


ngOnInit()
{
    this.grid.getRowNodeId = (data) => {
        return data.entityId;
    };


    this.columns = [
        {headerName: 'App Name', field: 'name', rowDrag: true, headerCheckboxSelection: true, checkboxSelection: true},
        {headerName: 'App Id', field: 'id'},
        {headerName: 'Compatibility', field: COMPATIBILITY'},
        {headerName: 'Creation', field: 'createdAtToString'},
        {headerName: 'Last Update', field: 'updatedAtToString'}
    ];
}


deleteRow()
{
    let ids = this.gridApi.getSelectedNodes()
           // .map((row) => {
               // return {id: row.entityId}
               // return row.entityId;
           // });


    console.log(ids);
    this.grid.api.applyTransaction({remove: ids});
}

I tried both with and without map statement, nothing worked but my Add and Update works fine.

ag-grid-angular ag-grid
2 Answers

Replace map with following code.

.map((row) => {
   return {entityId: row.data.entityId};
});

it should be the the same field (entityId) which i set in getRowNodeId function.

user_42999260

In a typical situation, where one does not define a getRowNodeId, one should be able to do:

const removeData: any[] = [{id: rowNode0.id}, {id: rowNode1.id}, ...];
applyTransaction({remove: removeData});

where rowNode0, rowNode1, etc. are the nodes you want to remove.

However when you provide your own getRowNodeId callback, ag-grid will fetch the id's by applying your callback on the data you provided. Therefore, the name(s) in the data must match those used in your callback. That's why return {id: row.entityId} doesn't work, but return {entityId: row.entityId} does.

In other words, if one defines:

this.grid.getRowNodeId = (data) => {
    return data.column1 + data.column5 + data.column2;
};

Then one would need to provide

const removeData: any[] = [
    {column1: 'a1', column2: 'b1', column5: 'c1'},
    {column1: 'a2', column2: 'b2', column5: 'c2'},
    {column1: 'a3', column2: 'b3', column5: 'c3'},
];

so that ag-grid would have all the names it needs to find the id's via the given getRowNodeId.

user_60491730
Related