Угловая сетка пользовательского интерфейса: экспорт скрытых столбцов при выборе пользователем Экспорт видимых данных

Привет Я использую сетку углового UI. У меня 3 столбца. Один из столбцов скрыт. Когда пользователь нажимает на Export Visible data как CSV или Export Visible data как Pdf, необходимо также экспортировать скрытый столбец. Как я могу это достичь?Угловая сетка пользовательского интерфейса: экспорт скрытых столбцов при выборе пользователем Экспорт видимых данных

Вот ссылка на plunkr http://plnkr.co/edit/Vwq7azXtx0GV7idvrSvq?p=preview

HTML: Вот мой код

<!doctype html> 
<html ng-app="app"> 
    <head> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-touch.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script> 
    <script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script> 
    <script src="http://ui-grid.info/docs/grunt-scripts/pdfmake.js"></script> 
    <script src="http://ui-grid.info/docs/grunt-scripts/vfs_fonts.js"></script> 
    <script src="http://ui-grid.info/release/ui-grid.js"></script> 
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css"> 
    <link rel="stylesheet" href="main.css" type="text/css"> 
    </head> 
    <body> 

<div ng-controller="MainCtrl"> 
    <div ui-grid="gridOptions" ui-grid-selection ui-grid-exporter class="grid"></div> 
</div>

<script src="app.js"></script> 
    </body> 
</html> 
var app = angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid', 'ui.grid.selection', 'ui.grid.exporter']); 

app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) { 
    $scope.gridOptions = { 
    columnDefs: [ 
     { field: 'name' }, 
     { field: 'gender', visible: false}, 
     { field: 'company' } 
    ], 
    enableGridMenu: true, 
    enableSelectAll: true, 
    exporterCsvFilename: 'myFile.csv', 
    exporterPdfDefaultStyle: {fontSize: 9}, 
    exporterPdfOrientation: 'portrait', 
    exporterPdfPageSize: 'LETTER', 
    exporterPdfMaxGridWidth: 500, 
    onRegisterApi: function(gridApi){ 
     $scope.gridApi = gridApi; 
    } 
    }; 

    $http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100.json') 
    .success(function(data) { 
    $scope.gridOptions.data = data; 
    }); 

}]);

Здесь колонка пол скрыта. Но когда я нажимаю на Export Visible data как csv/pdf, я хочу, чтобы этот скрытый столбец также был экспортирован.

источник

2017-01-17 ASR

Почему вы не выбираете «** Экспортировать все данные как csv **» в меню вместо «** Экспортировать видимые данные как csv **»? – Mistalis

Я хочу, чтобы оба параметра возвращали значения скрытых столбцов. Экспорт всех данных, а также экспорт видимых данных должен экспортировать мой скрытый столбец – ASR

Он явно конфликтует с попытками выбора – Mistalis

У меня такое же требование, и я смог выполнить это со следующим.

$scope.gridOptions = { 
    exporterMenuCsv: true, 
    exporterMenuPdf: true, 
    exporterMenuVisibleData: false, // suppress default menu options 

    columnDefs: [ 
     // define columns 
    ], 

    onRegisterApi: function (gridApi) { 
     const grid = gridApi.grid; 

     // add our own export visible data menu option 
     // we want to export all columns, not just visible ones 
     // add a small delay because the addToGridMenu function 
     // may not be defined yet when this code is executed 
     $timeout(function() { 
      grid.api.core.addToGridMenu(grid, [ 
       { 
        title: i18nService.getSafeText('gridMenu.exporterVisibleAsCsv'), 
        action: function ($event) { 
         grid.api.exporter.csvExport(uiGridExporterConstants.VISIBLE, uiGridExporterConstants.ALL); 
        }, 
        shown: function() { 
         return grid.options.exporterMenuCsv; 
        }, 
        order: grid.options.exporterMenuItemOrder + 1 
       }, 
       { 
        title: i18nService.getSafeText('gridMenu.exporterVisibleAsPdf'), 
        action: function ($event) { 
         grid.api.exporter.pdfExport(uiGridExporterConstants.VISIBLE, uiGridExporterConstants.ALL); 
        }, 
        shown: function() { 
         return grid.options.exporterMenuPdf; 
        }, 
        order: grid.options.exporterMenuItemOrder + 4 
       } 
      ]); 
     }, 200); 
    } 
}

код скрывает по умолчанию «Экспорт видимых данных ...» опции меню, добавленные модулем UI сетки-экспортера и добавляет новые. Функция действия вызывает метод экспорта, указывающий uiGridExporterConstants.ALL вместо uiGridExporterConstants.VISIBLE для типа столбца.

источник

2017-11-13 19:10:00

Угловая сетка пользовательского интерфейса: экспорт скрытых столбцов при выборе пользователем Экспорт видимых данных

ответ

Смежные вопросы