javascriptangularjsangular-uing-grid

howto disable selection in ng-grid


Is it possible to "disable" or lock the selection of a ng-grid using the inbuilt functionality? I want the user to be able to select a row, click a button and then the grid will stay locked until the user presses another button.


Solution

  • Yes, you can return false from beforeSelectionChange to disable changing the selected rows on the grid.

    $scope.option = {
        enableRowSelection: true,
    };
    $scope.gridOptions = {
        data: 'myData',
        beforeSelectionChange: function() {
          return $scope.option.enableRowSelection;
        }
        //, ...
    };
    

    HTML:

    <button ng-click="option.enableRowSelection=false">Freeze Selection</button>
    <button ng-click="option.enableRowSelection=true">Unfreeze Selection</button>
    <div class="gridStyle" ng-grid="gridOptions"></div>
    

    Example Code: http://plnkr.co/edit/PbhPzv?p=preview

    See also: https://github.com/angular-ui/ng-grid/wiki/Configuration-Options