Search code examples
angularjsangular-uiui-grid

How to pass row.entity inside celleditablecondition in UI-grid?


I am trying to set cellEditableCondition based on content of other cell in same row.

For that how do I pass row.entity to cellEditableCondition?

I tried passing row as arguement to function defined oncellEditableCondition but that row object does not have entity property.

I want something like below:

columnDefs: [{
  name: 'column1',
  field: 'name',
  cellEditableCondition: function(row) {
    return row.entity.lastname === 'Adams'
  }

}, {
  name: 'column2',
  field: 'lastname'
}]

Solution

  • This small tweak to your code should do it:

    var app = angular.module('app', ['ui.grid', 'ui.grid.edit']);
    app.controller('MainCtrl', ['$scope', function($scope) {
      $scope.gridOptions = {
        columnDefs: [{
          name: 'column1',
          field: 'name',
          cellEditableCondition: function(scope) {
            return scope.row.entity.lastname === 'Adams'
          }
        }, {
          name: 'column2',
          field: 'lastname'
        }],
        data: [{name: "Tim", lastname: "Harker"},
               {name: "Akash", lastname: "Adams"}]
      }
    }]);
    div[ui-grid] {
      height: 130px;
    }
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.js"></script>
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.css" />
    <div ng-app="app" ng-controller="MainCtrl">
      <div ui-grid="gridOptions" ui-grid-edit>
      </div>
    </div>

    Let me know if you have any other questions. Happy to help further, if needed.