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!!

Answer 1

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'
  }
}