jsPDF auto table wide column content not breaking

Question

I'm using jsPDF Auto Table to grab html content from a table and display in jsPDF document for exporting, but no matter what I try, seem unable to get the column width's breaking/ wrapping as i'd like.

Ideally would like the table and columns to calculdate their width's automatically, with the long column content wrapping across multiple lines, similar to the "long: overflow linebreak" example here: https://simonbengtsson.github.io/jsPDF-AutoTable/#long

Although I'm using the same code from the example, it doesn't generate in the same way.

exportGraph = function () {
    var doc = new jsPDF();
    var elem = document.getElementById("basic-table");
    var res = doc.autoTableHtmlToJson(elem);

    doc.autoTable(res.columns, res.data, {
        startY: 15,
        margin: { horizontal: 0 },
        bodyStyles: { valign: 'top' },
        styles: { overflow: 'linebreak', columnWidth: 'wrap' },
        columnStyles: { text: { columnWidth: 'auto' } }
    });

    doc.save('test.pdf');
};

jsfiddle example

Any help would be greatly appreciated as this is getting really frustrating now!!

Simon Bengtsson · Accepted Answer · 2019-08-14T07:24:17.430

10

The text key in the example is a reference to the datakey in the example data. As you are using the autoTableToHtml function your data keys will be integer based and therefore your columnStyles should like like this:

columnStyles: {
  2: {
    columnWidth: 'auto'
  }
}

edited Aug 14 '19 at 07:24

answered Apr 03 '17 at 19:12

Simon Bengtsson

7,573
3
58
87

1

Awesome, that's the ticket! Thanks Simon. Great plugin :) – Wiggy Apr 04 '17 at 08:16
@Simon, can I wrap text and center align text created using doc.text() as well or does it work only with doc.autoTable()? – Ramachandra A Pai Jan 17 '19 at 14:30

score 2 · Answer 2 · answered Mar 09 '20 at 10:10

2

columnWidth is deprecated in the newer versions. It is renamed to cellWidth.

  columnStyles: {
      2: {
        cellWidth: 'auto'
      }
    }

answered Mar 09 '20 at 10:10

Pradeep B P

396
4
8

score 0 · Answer 3 · answered Jul 29 '21 at 18:22

0

columnWidth is deprecated in the newer versions. It is renamed to cellWidth.

columnStyles: {
  2: {
    cellWidth: 'auto'
  }
}

ERROR: auto is not defined

answered Jul 29 '21 at 18:22

EduAvila

11
1

jsPDF auto table wide column content not breaking

3 Answers3