issue while using JsPdf AutoTable setting newline on 'd' and other characters

Question

I' using jsPDF with AutoTable in my WebSite, and there is an issue when i'm exporting my Table to PDF.

When the PDF contains 'd' letter in the string in a column, after the 'd' jsPDF will set a newline by breaking a word and by making the PDF unreadable.

There were other cases even with other characters like number '2'.

Is there a way to fix it?

Here is how it looks like when exported:

While the text breaked was:

antipasto con gnocco patate  + spergola
bimbi verdi + tagliatella ragù
tortello verde + riso
misto carni arrosto con patate e padleda
Alessandra cioccolatina con smarties

My function where i make the jsPDF looks like this:

function PDF(id, stat) {
    var doc = new jsPDF('l', 'pt', 'a4', true);
    var table = '#' + id;
    var text = 'Prenotazioni del ' + moment($("#day").attr('data-giorno')).format('DD MMMM YYYY');

    doc.setFontSize(18);
    doc.text($('#titlepdf').val(), 14, 22);
    doc.setFontSize(11);
    doc.setTextColor(100);

    doc.text(text, 14, 35);

    doc.autoTable({
        html: table,
        startY: 45,
        showHead: 'firstPage',
        includeHiddenHtml: true,
        columnStyles: {
            0: {
                columnWidth: 80
            },
            1: {
                columnWidth: 50
            },
            2: {
                columnWidth: 50
            },
            3: {
                columnWidth: 50
            },
            4: {
                columnWidth: 100
            },
            5: {
                columnWidth: 200
            }
        },
        headStyles: {
            fillColor: [189, 21, 63],
            fontSize: 10,
            theme: 'grid'
        },
        styles: {
            overflow: 'linebreak',
            columnWidth: 'wrap',
            font: 'arial',
            fontSize: 10,
            cellPadding: 8,
            overflowColumns: 'linebreak'
        }
    });

    doc.text(stat, 14, doc.autoTable.previous.finalY + 15);

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

Here is the table:

<table id="tableGiorno" class="table table-hover" style="margin-bottom: 0px; font-size: 12px;">
    <thead>
        <tr>
            <th>Nome</th>
            <th>Orario</th>
            <th>Tavolo</th>
            <th>Coperti</th>
            <th>Telefono</th>
            <th>Note</th>
        </tr>
    </thead>
    <tbody id="bodyGiorno">
        <tr data-tavolo="34">
            <td>Igor</td>
            <td>14:00</td>
            <td>4</td>
            <td>1</td>
            <td>
                <a onclick="event.stopImmediatePropagation();" href="tel:" rel="nofollow"></a>
            </td>
            <td>Da oggi sono stato fedele grazie alla lorem</td>
        </tr>
    </tbody>
</table>

Where do You get the file? This seems an encoding issue, because `0x0d` is the carriage return - moreover `0x200d` and `0x200a` are also specified inside the **xref** table for line endings. Please, check the character encoding of Your files and documents... — deblocker, May 17 '21 at 15:21
try putting the text inside a
with
tags `

antipasto con gnocco patate + spergola

bimbi verdi + tagliatella ragù

tortello verde + riso

misto carni arrosto con patate e padleda

Alessandra cioccolatina con smarties

` — Nathan TM, May 18 '21 at 05:05

score 4 · Accepted Answer · answered May 18 '21 at 09:03

4

Solved by changing the jsPDF version to the last one (2.3.1) i was using the 1.5.3.

answered May 18 '21 at 09:03

NiceToMytyuk

3,644
3
39
100

Is there a migration guide? I'm migrating 1.5.3 to 2.3.1 but it has broken a lot and not a migration guide in sight. – BeniaminoBaggins Jun 14 '21 at 02:11
1

@BeniaminoBaggins i don't think so, i had to change all library files and had to implement again all my jsPDF functions, actually it didn't took too much for me as i used it in two tables, you can make a new question about the errors it gives to you after the migration – NiceToMytyuk Jun 14 '21 at 06:33

score -1 · Answer 2 · answered May 22 '21 at 21:50

-1

This issue is precisely for the lower versions fo the jsPDF. If you upgrade to the latest version i.e. >(2.3), the issue will get resolved.

answered May 22 '21 at 21:50

Mir

50
5

issue while using JsPdf AutoTable setting newline on 'd' and other characters

2 Answers2