CODEWITHSUNDEEP
angularjspdfjspdf-autotable
Joenel
Joenel

Reputation: 21

Not All Data in Columns are displayed in generated PDF

I have 12 columns of data in my table. But only 7 out of 12 columns are being captured and generated to PDF.

See sample output pdf in the screenshot: (It should return 12 columns of data)

enter image description here

Here's my code: (I am using angular 5)

var doc = new jsPDF('p', 'pt');
var res = doc.autoTableHtmlToJson(document.getElementById("export- 
buttons-table"));
doc.autoTable(res.columns, res.data, {
  margin: {top: 40, horizontal: 10},
  startY: false,
  pageBreak: 'auto',
  tableWidth: 'wrap',
  showHeader: 'everyPage',
  tableLineColor: 200,
  tableLineWidth: 0,
  styles: {overflow: 'linebreak', font: 'arial', fontSize: 10, cellPadding: 8},
});

doc.save(this.filename + 'pdf');

Upvotes: 0

Views: 1347

Answers (1)

Joenel
Joenel

Reputation: 21

I fixed this by myself :)

Please see my source code below:

exportToPdf(){
  var doc = new jsPDF(this.pdfOrientation, 'pt', this.pdfFormat);
  var res = doc.autoTableHtmlToJson(document.getElementById("export-buttons- 
  table"));
  doc.autoTable(res.columns, res.data, {
    margin: {top: 40, horizontal: 10}, startY: false, theme: 'grid', pageBreak: 
   'always', tableWidth: 'auto', columnWidth: 'wrap', showHeader: 'everyPage',
    tableLineColor: 200, tableLineWidth: 0,
    columnStyles: {
    0: {columnWidth: 'auto'}, 1: {columnWidth: 'auto'}, 2: {columnWidth: 'auto'}, 3: 
        {columnWidth: 'auto'}, 4: {columnWidth: 'auto'},
    5: {columnWidth: 'auto'}, 6: {columnWidth: 'auto'}, 7: {columnWidth: 'auto'}, 8: 
        {columnWidth: 'auto'}
    },
    headerStyles: {theme: 'grid'},
    styles: {overflow: 'linebreak', columnWidth: 'wrap', font: 'arial', fontSize: 10, 
    cellPadding: 8, overflowColumns: 'linebreak'},
    });
  doc.save(this.filename + '.pdf');
 }

output

Upvotes: 1

Related Questions