gridApi.edit.on.afterCellEdit 自动选中复选框

问题描述 投票:0回答:2

我正在使用 angularjs 和 ui.grid。我有一些问题。我希望在编辑单元格后自动选中复选框.. 我已经尝试了很多次在编辑单元格后自动检查代码,但仍然没有成功。最好的解决方法是什么。

这是我在 plnkr

中的演示

示例代码

    $scope.checkboxData = false;

 $scope.checkboxCheck = checkboxCheck;
         function checkboxCheck(params, statusCheck) {
            console.log("test checked");
            console.log(params);
            console.log(statusCheck);

            
        
         }


  $scope.gridOptions = {

    enableCellEdit: false, 

    enableCellEditOnFocus: true,

    cellEditableCondition: function($scope) {

      return $scope.row.entity.isActive;

    }

  };

    $scope.gridOptions.columnDefs = [
    
        {name: 'isActive', displayName: 'Edit Status', enableColumnMenu: false, cellTemplate: 'cellTemplate_lock.html'}, // displays isActive status as a button and allow toggling it 
    
        {name: 'name', enableCellEdit: true}, // editing is enabled for this column, but will be overridden per row by cellEditableCondition
    
        {name: 'company', enableCellEdit: true},
          { displayName: 'Select', name: 'checkbox', field: 'checkboxData', enableFiltering: false, enableCellEdit: false, cellTemplate: '<span style="margin-left: 0px;"><input class="Checkbox" type="checkbox" name="checkboxData" ng-model="checkboxData" ng-click="grid.appScope.checkboxCheck(row.entity, checkboxData)" id="{{row.entity.seq_no}}"></input><label for="{{row.entity.seq_no}}"><span></span></label></span>',width: 60 } // same for this column
    
      ];
    
    
      $scope.gridOptions.onRegisterApi = function(gridApi) {
    
        $scope.gridApi = gridApi;
    
        gridApi.edit.on.afterCellEdit($scope, function(rowEntity, colDef, newValue, oldValue) {
    
          $scope.msg.lastCellEdited = 'ID: ' + rowEntity.id + ', Column: ' + colDef.name + ', New Value: ' + newValue + ', Old Value: ' + oldValue;
    
          $scope.$apply();
    
        });
angularjs angular-ui-grid
2个回答
0
投票

也许你需要添加这个: rowEntity.checkboxData = true;


0
投票

我已经更新了代码,您没有为复选框绑定 ng-model 中的值。请参阅下图以获取复选框列的更新代码。

© www.soinside.com 2019 - 2024. All rights reserved.