ngGrid - remove row

前端未结

关注

 6  704

I have been looking for an example on how to implement a button to remove a selected row, but I couldn\'t find anything useful so far.

Can anyone please give me a hint?

相关标签:

6条回答

[愿得一人]

2021-02-04 16:05

This works:

showSelectionCheckbox : true ->it adds checkbox to grid and $scope.delItem = function() -> it works for both multiple rows or single row selection

     $scope.mySelections = [];
                 $scope.gridOptions = {
                     data :'data',
                     selectedItems : $scope.mySelections,
                     showSelectionCheckbox : true
                 } 

 $scope.delItem = function() {
      for (var i = 0; i < $scope.mySelections.length; i++) {
             var index = $scope.data.indexOf($scope.mySelections[i]);
             if (index != -1) {
                 $scope.data.splice(index, 1);
             }
         }
     }

0 讨论(0)

北恋

2021-02-04 16:14
Previous answer to this question won't work once the array has been sorted because the row.index changes based on the way the array has been sorted but the original data in the array remains in it's original index. We must find the correct index in the data array in order to remove the correct row. The row contains a reference to the original data in row.entity so we can use indexOf to find the correct index.
```
$scope.actionTemplate = '<input type="button" value="Delete" ng-click="delete($event);" />';

$scope.delete = function($event) {
    $event.stopPropagation(); //keep the row from being selected
    $scope.data.selectAll(false); //remove all selections: necessary for issues with the selection array
    var index = $scope.data.indexOf(this.row.entity); //get the correct index to splice
    $scope.metrics.splice(index, 1); //remove the element
};
```
Edit: The original solution may have worked at the time but ng-grid has since been updated and it no longer works.
0 讨论(0)
发布评论:

提交评论
- 加载中...

眼角桃花

2021-02-04 16:16

It might help you

<!doctype html>
<html ng-app="deleteApp">
<head>
  <title>Example - www.code-sample.com</title>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.1/angular.min.js"></script>
  <script>
    angular.module('deleteApp', [])
      .controller('deleteController', ['$scope', function ($scope) {
          $scope.Rows = [
            { row: 'RowCount1'},
            { row: 'RowCount2'},
            { row: 'RowCount3'},
            { row: 'RowCount4'},
            { row: 'RowCount5'}];

            $scope.delete = function(index){
              $scope.Rows.splice(index, 1);
            }
      }]);
  </script>
</head>
<body ng-controller="deleteController">
  <div ng-repeat="ro in Rows">
    <div>{{$index + 1}} :  {{ro.row}} <input type="button" value="delete" ng-click="delete($index)" /></div>
  </div>
</body>
</html>

0 讨论(0)

情深已故

2021-02-04 16:21
That is not a proper way to delete any row

Try like this:
```
$scope.removeRow = function() {
   var index = this.row.rowIndex;
   $scope.gridOptions.selectItem(index, false);
   $scope.myData.splice(index, 1);
};
```
PLUNKER --> Its working and tested
0 讨论(0)
发布评论:

提交评论
- 加载中...

说谎

2021-02-04 16:23

This might help you, and also this is for deleting multiple rows in the grid.

$scope.mySelections = [];

$scope.gridOptions = {
    data :'gridData',
    selectedItems : $scope.mySelections,
    showSelectionCheckbox : true
}

$scope.deleteSelected = function() {
    angular.forEach($scope.mySelections, function(rowItem) { 
    $scope.gridData.splice($scope.gridData.indexOf(rowItem),1);
});
}

mySelections is the array which has selected rows

0 讨论(0)

后悔当初

2021-02-04 16:25

thanks for the hint but I tried the snippet and it doesn't work so I changed it in

var removeTemplate = '<input type="button" value="remove" ng-click="removeRow()" />';
$scope.removeRow = function() {;
                    var index = this.row.rowIndex;
                    alert(index);
                    $scope.gridOptions.selectItem(index, false);
                    $scope.items.splice(index, 1);
                };

and it works like a charme :) Hope this help.

0 讨论(0)