CODEWITHSUNDEEP
javascriptangularjsangular-ui-grid
Jesh
Jesh

Reputation: 63

Selected Items are not getting reset after refreshing Angular UI Grid

I have a functionality where I have to select the rows in ui grid (ui-grid-selection) and perform an operation on them which in turn changes the grid data(fields in selected rows).

To reload the changed data, I am making an ajax call again. This refreshes the data, but it is storing the last selectedrows which is not allowing to perform operations again on the refreshed grid.I found this issue with the help of GridFooter where the selectedItems is not reseting to 0 after refresh.

// Getting Selected rows

onRegisterApi : function(gridApi){

                // Set gridApi on scope
                $scope.gridApi = gridApi;


                gridApi.selection.on.rowSelectionChanged($scope,function(row){
                    var msg = 'row selected ' + row.isSelected;
                    console.log(msg);
                    $scope.mySelectedRows= $scope.gridApi.selection.getSelectedRows();  
                    console.log( $scope.mySelectedRows);

                });

            }

How to make selectedItems reset to 0 after the below refresh?

Here is my refresh function. Also Please let me know if there is more better way to do it.

// Refreshing Grid data

    $scope.refresh= function(){     

        $http.post("WS/querybuilder", $rootScope.wholecond).success(function(data){

            console.log("hitting the service");
            $scope.myData=data; //Passing data to my grid
            //$scope.mySelectedRows=[];         
            //console.log($scope.myData);
        });
        //$scope.$apply();
    }

Upvotes: 3

Views: 3808

Answers (4)

AbVog
AbVog

Reputation: 1555

The number of selected items not being reset after the grid's data is refreshed seems to be a bug in the code of the grid.

I have faced the same problem and after reading the source code, solved it with calling selection.clearSelectedRows() on the grid before loading the new data.

Upvotes: 0

user202925
user202925

Reputation: 521

Try clearing selected rows in the refresh function.

// Refreshing Grid data

$scope.refresh= function(){     

    $http.post("WS/querybuilder", $rootScope.wholecond).success(function(data){

        console.log("hitting the service");
        $scope.myData=data; //Passing data to my grid
        $scope.gridApi.selection.clearSelectedRows();
        //$scope.mySelectedRows=[];         
        //console.log($scope.myData);
    });
    //$scope.$apply();
}

If that doesn't work you can brute-force by iterating through all rows and setting them to false, like:

     $scope.gridApi.grid.rows.map(function (row) {
                row.setSelected(false);
            }
        });
    });

but clearSelectedRows() should work.

Upvotes: 0

G-Man
G-Man

Reputation: 7241

This is the correct way to reset/clear the selected rows of the ui-grid

$scope.gridApi.selection.clearSelectedRows()

Upvotes: 2

Kathir
Kathir

Reputation: 6196

Just notifying the type of change to the grid api, will fix this problem. you dont have to use your refresh method.

$scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL);

This will notify a refresh on the table. There are other type of events you can use as well- ( ALL, ROW, EDIT, COLUMN )

Upvotes: 0

Related Questions