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

rbl8hiat  于 2023-04-19  发布在  Angular
关注(0)|答案(2)|浏览(116)

bounty将在5天后到期。回答此问题可获得+250声望奖励。javiens正在寻找来自信誉良好的来源的答案:我想编辑单元格后可以触发复选框可以调用函数来发送值

我正在使用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();
    
        });
raogr8fs

raogr8fs1#

也许你需要加上这个:return true;

7fhtutme

7fhtutme2#

我已经更新了代码,你必须在ng-model中为复选框绑定正确的值。请查看下图中复选框列的更新代码。

相关问题