1

I am new working with the Angular UI-GRID and I need to create external buttons for the exporting features like PDF export I have read the documentation and found that I can use PDFMake library to create complex header through out the documentation I didn't found any example to resolve my issue.

Please look into the image and help me out. How can I combine both the feature?

var docDefinition = {
            content: [
                {
                    layout: 'lightHorizontalLines', // optional
                    table: {
                        // headers are automatically repeated if the table spans over multiple pages
                        // you can declare how many rows should be treated as headers
                        headerRows: 1,
                        widths: ['*', 'auto', 100, '*'],

                        body: [
                            ['First', 'Second', 'Third', 'The last one'],
                            ['Value 1', 'Value 2', 'Value 3', 'Value 4'],
                            [{ text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4']
                        ]
                    }
                }
            ]
        };

     //   #region export data
        
        pdfMake.createPdf(docDefinition).open();
       // #endregion
       
// with this I can export pdf with table
 var grid = $scope.gridApi.grid;
 var rowTypes = uiGridExporterConstants.ALL;
 var colTypes = uiGridExporterConstants.ALL;
 uiGridExporterService.pdfExport(grid, rowTypes, colTypes);
        
 //With this I can export my grid but without header.
SageMode27
  • 29
  • 4

1 Answers1

1

It can be done by using header function and adding table in it:

  header: function() {
    return {
      table: { 
       // Add your table data here       
      
      },
    };
  },
H S W
  • 6,310
  • 4
  • 25
  • 36