javascript - JSPDF AUTOTABLE not displaying proper table Border - Stack Overflow

admin管理员组

文章数量:1417661

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:

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

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:

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

• javascript
• jspdf
• jspdf-autotable

Share Improve this question Follow edited Mar 1, 2016 at 20:49 Simon Bengtsson 8,21133 gold badges6464 silver badges9090 bronze badges asked Jan 7, 2016 at 11:01 Asha KoshtiAsha Koshti 3,01355 gold badges2424 silver badges3030 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

As the author of the plugin I can't think of a simply way to acplish this unfortunately. The only thing that es to mind is that you can try utilizing for example the afterContent hook and add a rectangle on each page that is a few pixels larger than the table. In effect emulating a border.

I have seen this feature request mentioned before however and I'm considering adding it in a future release. Not in the near term though.

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.

本文标签： javascriptJSPDF AUTOTABLE not displaying proper table BorderStack Overflow