CODEWITHSUNDEEP
angularjsgroupingng-gridangular-ui-grid
Asqan
Asqan

Reputation: 4479

Disable/Enable Grouping in ui-grid

I have a ui-grid whose first column is:

  columnDefs : [$scope.getGroupIdColumn(),
                $scope.getKlasCodeColumn(),
                $scope.getKlasNummerColumn(),
                $scope.getNaamColumn()
            ]

where getGroupIdColumn is: 

    $scope.getGroupIdColumn = function () {
        var result = new Object();
        result["name"] = 'GroupID';
        result["visible"] = false;
        result["type"] = 'number';
        if ($scope.groupingEnabled) {
            console.log("komt toch: " + $scope.speedDial.grouping);
            var grObj = new Object();
            grObj["groupPriority"] = 0;
            result["grouping"] = grObj;
            return result;
        }
        return result;
    }

Other column definitions are also like this.

If groupingEnabled is true, i have grouping. If false, without grouping. Until here, it works as excepted.

BUT

If i redefine that column, or even all the grid-options, it remains same as it is. Thus, if i have a grid with grouping and i redefine all grid options, i have still grid with grouping.

What should be done?

PS: gridApi.core.refresh(), $evalAsync().. are tried and no any improvement.

Upvotes: 0

Views: 3110

Answers (2)

Asqan
Asqan

Reputation: 4479

I just can't believe it was so easy! I'll write my functions which will be easier for people to get started: (also here is the documentation)

  1. Set gridApi in $scope:

    $scope.gridOptions.onRegisterApi = function (gridApi) {
    $scope.gridApi = gridApi;
}

  2. Save your grouping info:

    $scope.groupInfo = $scope.gridApi.grouping.getGrouping();

  3. Just define these functions

    $scope.groupData = function () {
    if ($scope.groupInfo != undefined) {
        $scope.gridApi.grouping.setGrouping($scope.groupInfo);
    }
    setTimeout(function () {
        $scope.gridApi.treeBase.expandAllRows();
    }, 400);
    $scope.$evalAsync();
}

$scope.ungroupData = function () {
    // if ($scope.groupInfo != undefined) {
        // $scope.groupInfo = $scope.gridApi.grouping.getGrouping();
    // }
    $scope.gridApi.grouping.clearGrouping();
}

Upvotes: 2

Andzej Maciusovic
Andzej Maciusovic

Reputation: 4476

For my case I needed to toggle grouping and I tried your answer but it do not work for me so I changed it a bit.

$scope.groupData = function () {
    $scope.gridApi.grouping.groupColumn('columnName');
    $timeout(function(){
      $scope.gridApi.treeBase.expandAllRows();
    }, 300);
}

Working example http://plnkr.co/edit/AtcLSsqqnSaFeLfOEJhc?p=preview

Upvotes: 1

Related Questions