Reputation: 632
AM using UI-GRID in an angular project an am wondering is there a way to keep track of the order of selected rows (allowing the user to select/unselect rows)
the order gridApi.selection.getSelectedRows()
returns is not ideal to work with .Any ideas please ?
http://plnkr.co/edit/gD4hiEO2vFGXiTlyQCix?p=preview . (the plnkr might help to highlight the issue if you select/unselect elements at random you will see the order how the elements are saved)
Upvotes: 1
Views: 688
Reputation: 2407
I believe this might be close to what you want, Mero.
JavaScript/AngularJS Controller:
var app = angular.module('app', ['ui.grid', 'ui.grid.selection']);
app.controller('MainCtrl', ['$scope', '$http', function($scope, $http) {
$scope.mySelections = [];
$scope.mySelectionsInOrder = [];
$scope.gridOnRegisterApi = function(gridApi) {
gridApi.selection.on.rowSelectionChanged($scope, function(row) {
$scope.mySelections = gridApi.selection.getSelectedRows();
if (row.isSelected) {
$scope.mySelectionsInOrder.push(row.entity);
} else {
$scope.mySelectionsInOrder.splice($scope.mySelectionsInOrder.indexOf(row.entity), 1);
}
console.log($scope.mySelections);
});
};
$scope.gridOptions = {
enableSelectAll: true,
enableRowSelection: true,
enableRowHeaderSelection: false,
enableFullRowSelection: true,
showGridFooter: true,
onRegisterApi: $scope.gridOnRegisterApi
}
$http.get('data.json')
.then(function(response) {
$scope.gridOptions.data = response.data;
});
}]);
The basic idea is to keep track of selections during the rowSelectionChanged
event and determine with row.isSelected
as to whether we should push
or splice
.
Here's a working Plunker, http://plnkr.co/edit/lnng9coOQHca3PzOSjQI?p=preview.
Hope this helps, let me know if you have any more questions.
Upvotes: 1