Search code examples
angularjsangular-ui-gridui-grid

how to keep track of the order of selected rows in UI-Grid?


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)


Solution

  • I believe this might be close to what you want, Mero.

    enter image description here

    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.