Dynamically hide rows in a ng-grid AngularJS

74 Views Asked by At

I have declared a column called State as enum with 4 values: None (default value), Updated, New and Delete.

I put a column button called "Acciones", when i click that button this call a event that change the value of State to "Delete", i want to hide that row when this happen but the filteroptions doesnt work.

This is my code:

           $scope.stateCRUD = {
               0: 'None',
               1: 'New',
               2: 'Delete',
               3: 'Update' 
           };

           $scope.filterOptions = {
               filterText: 'state:Delete',
               useExternalFilter: true
           };

           $scope.gridOptionsDetailCurvaOriginal = {

               data: 'detailCurvaOriginalList',
               columnDefs: [
                   { field: 'objetoItem', displayName: 'Item', width:'130px', cellClass: 'grid-align', visible: false},
                   { field: 'ejercicio', displayName: 'Ejer', width: '12%', cellClass: 'grid-align', enableCellEdit: $scope.canEdit(), resizable: true },
                   { field: 'importe', displayName: 'Importe', width: '20%', cellClass: 'grid-align', enableCellEdit: $scope.canEdit() },
                   { field: 'state', displayName: 'State', width: '130px', cellClass: 'grid-align', visible: true },
                   { displayName: 'Acciones', width: '12%', cellClass: 'grid-align', cellTemplate: '<div class="ng-grid-icon-container"><a href="javascript:void(0)" class="btn btn-rounded btn-xs btn-icon btn-default" ng-click="DeleteItemCurvaOriginal(row)"><i class="fa fa-close"></i></a></div>' }
               ],
               showFooter: true,
               enableRowSelection: true,
               filterOptions: $scope.filterOptions,
               multiSelect: false,
               enableCellEditOnFocus: false,
               selectedItems: $scope.mySelections,
               totalServerItems: 'detailCurvaOriginalTotalItems',
               beforeSelectionChange: function (data) { $scope.idRowSelectedCurvaOriginal = data.rowIndex; },
               jqueryUITheme: false
           };

           $scope.DeleteItemCurvaOriginal = function (row) {
               $scope.detailCurvaOriginalList[row.rowIndex].state = $scope.stateCRUD[2];
           };
0

There are 0 best solutions below