How to remove some columns in pdf export in angular js ui grid

Question

I am using Angular JS ui Grid

http://ui-grid.info/docs/#/tutorial/312_exporting_data_complex

My requirement is what I want to show, for example. 5 columns, but when I export PDF, I do not want to export some columns, for example username .

How can i do this?

Answer 1

There is gridOption to do just that: exporterSuppressColumns

I edited the plunker from the UI Grid documentation to demonstrate hiding the "Paul" column in the exported PDF: http://plnkr.co/edit/89ZVlPZcQbHYzgX5l4yq?p=preview

Now, whether you choose to export "all" or export "visible", you will never see the gender column in the output.

  $scope.gridOptions = { columnDefs: [ { field: 'name',visible:true }, { field: 'gender', cellFilter: 'mapGender', exporterPdfAlign: 'right', visible:true, enableHiding: true }, { field: 'company', visible: false } ], exporterSuppressColumns: [ 'gender' ], 

The documentation is here: http://ui-grid.info/docs/#/api/ui.grid.exporter.api:GridOptions

Answer 2

exporterSuppressExport: true

Example

 { name: 'Description', enableCellEdit: true, cellTemplate: '<div class="ui-grid-cell-contents"><div ng-class="{\'viewr-dirty\' : row.inlineEdit.entity[col.field].isValueChanged }">{{row.entity[col.field]}}</div></div>' }, 

For more details see here http://ui-grid.info/docs/#/api/ui.grid.exporter.api:ColumnDef

Answer 3

Now here is the column that contains the button and should be excluded from export

 { name: null, exporterSuppressExport: true, field: "fake", cellTemplate: '<div class="tac"><a class="btn btn-red btn-xs ml5" ng-if="!row.inlineEdit.isEditModeOn" ng-click="grid.appScope.vm.deleteRow(row, $event)"><i class="fa fa-trash"><md-tooltip md-direction="left">delete</md-tooltip></i></a></div>', enableCellEdit: false, enableFiltering: false, enableSorting: false, showSortMenu: false, enableColumnMenu: false, width: 50, }, 

Answer 4

You can also simply add the exporterSuppressExport: true option to the desired column in your columns:

 $scope.gridOptions = { columnDefs: [ { field: 'username', exporterSuppressExport: true }, { field: 'someOtherField' } ], // other options ... }; 

Now only someOtherField exported.