Angular JS UI-Grid Delete Row

Sur picture Sur · Nov 25, 2014 · Viewed 30.9k times · Source

I'm new to ui-grid and I'm trying to implement a table in AngularJS as shown in the picture below. I'm trying to select a row and delete it using a delete button on that particular row. The ui-grid documentation requires us to use the gridApi but I can't find sufficient documentation for the same.

enter image description here

Answer

Blowsie picture Blowsie · Jan 21, 2015

Please see a working example of how to delete a row here. http://plnkr.co/edit/6TiFC6plEMJMD4U6QmyS?p=preview

The key is to use indexOf(row.entity) and not relying on row.index as it doesn't dynamically get updated.

$scope.deleteRow = function(row) {
  var index = $scope.gridOptions.data.indexOf(row.entity);
  $scope.gridOptions.data.splice(index, 1);
};

Generic approach

function deleteRow(row,grid) {
   var i = grid.options.data.indexOf(row.entity);
   grid.options.data.splice(i, 1);
}