dustyjuicebox dustyjuicebox - 3 months ago 90
AngularJS Question

Read the sum value from the column footer in UI - Grid?

I'm currently trying to read my column footer to make sure that the total sum from the aggregate is exactly 100. However I can not find a way to get that value from the grid functions. Maybe I missed a function in the docs. Is there a way to accomplish this or will I have to manually loop through my grid and sum the values?

Answer

You can use aggregates on the column footer to automatically show the sum of all the values in the column.

you can have your grid config like below

$scope.gridOptions = {
    showGridFooter: true,
    showColumnFooter: true,
    enableFiltering: true,
    columnDefs: [
        { field: 'name', width: '13%' },
        { field: 'address.street',aggregationType: uiGridConstants.aggregationTypes.sum, width: '13%' },
        { field: 'age', aggregationType: uiGridConstants.aggregationTypes.avg, aggregationHideLabel: true, width: '13%' },
        { name: 'ageMin', field: 'age', aggregationType: uiGridConstants.aggregationTypes.min, width: '13%', displayName: 'Age for min' },
        { name: 'ageMax', field: 'age', aggregationType: uiGridConstants.aggregationTypes.max, width: '13%', displayName: 'Age for max' },
        { name: 'customCellTemplate', field: 'age', width: '14%', footerCellTemplate: '<div class="ui-grid-cell-contents" style="background-color: Red;color: White">custom template</div>' },
        { name: 'registered', field: 'registered', width: '20%', cellFilter: 'date', footerCellFilter: 'date', aggregationType: uiGridConstants.aggregationTypes.max }
    ],
    data: data,
    onRegisterApi: function(gridApi) {
            $scope.gridApi = gridApi;
    }
};

http://plnkr.co/edit/nv1eJAIyD5xNDn8XI6L9?p=preview

To get the value from the footer, provided you know the column index and have a reference to the gridApi.

$scope.getFooterValue = function()
{
  console.log($scope.gridApi);
  alert($scope.gridApi.grid.columns[2].getAggregationValue());
}
Comments