Adding extra rows to UI Grid csv export

Question

I am using UI grid / Angular 1.5 for a project in work whereby I need to add in 2 rows at the end of a ui grid csv export. Have tried a callback before exporting but can't execute correct logic. Anyone any tips?

$scope.gridOptions.exporterFieldCallback = function(grid, row, col, value) {
    grid.rows[grid.rows.length] = 'Hello \n World'
}

Sherlocked Nguyen Sherlocked Nguyen · Accepted Answer · 2017-07-28T04:11:50

I haven't use UI Grid yet but let try.

As my understanding, you want to add 2 new rows in the exported CSV file.

In your code, you want to add row in the exporterFieldCallback but that callback will be executed for every row => you have 10 row, it'll execute 10 times => add 10 x 2 (rows) = 20 rows which you are not expected.

We have a document + plunker here

We modify the export function like this

$scope.export = function() {
    $scope.gridOptions.data.push({
        "name": "Hello world",
        "gender": 1,
        "company": "test company"
    });
    $timeout(function() {//$timeout denote that you will wait for angular to complete their digest + render before call  the exportation = you give UI grid to prepare NEW data before export it.
        if ($scope.export_format == 'csv') {
            var myElement = angular.element(document.querySelectorAll(".custom-csv-link-location"));
            $scope.gridApi.exporter.csvExport($scope.export_row_type, $scope.export_column_type, myElement);
        } else if ($scope.export_format == 'pdf') {
            $scope.gridApi.exporter.pdfExport($scope.export_row_type, $scope.export_column_type);
        };
    })
};

Adding extra rows to UI Grid csv export

1 Answers