Search code examples
javascriptjspdfjspdf-autotable

JSPDF AUTOTABLE not displaying proper table Border

I want to export PDF with JSPDF and i m using plugin as "jspdf.autotable" for creating tables.now the problem is i want the formatting style like below:

enter image description here

As you can see there is a border outside the table but not in header part,i have achieved it but when the rows exceed the page height the formatting of table is not rendered properly.as autotable plugin don't have built in functionality to only have border outside of table. I have another solution to add whole HTML in pdf but i dont want pictures as a tables. please help with this ..

Solution

  • I have had this problem too, unfortunately I didn't have the author to guide me, my bad I was not aware of stackoverflow back them. I had to go edit the library in order to achieve the desired result.

    I had to make changes to printRows() method and place a check to check for the first page and the rest of the pages from where I needed the table to begin. As the first page would have extra margin for the graph.

    I used the following in the table.rows.forEach() in the first if condition where it checks for the isNewPage() method : 

    if (pageCount == 1) {
    doc.setDrawColor(228, 228, 228);
    doc.rect(settings.margin.left, settings.startY + table.headerRow.height, table.width, row_height);
} else {
    doc.setDrawColor(228, 228, 228);
    doc.rect(settings.margin.left, settings.margin.top + table.headerRow.height + 30, table.width, row_height);
}
addPage();

    These are the checks that I used, and are specific to my application, see if you can get an idea on how to implement the rest on your own.