Customize table pagination for Html to pdf conversion

Question

I'm currently using openhtmltopdf to convert an html to pdf. The html has a table1(no header) with 3 rows, then some text and then table2(with a header) which can have many rows. Assuming table2 is getting paginated across multiple pages, the pdf should look like this -

table1(on every page having atleast 1 row from table2)
some text(only on the page having 1st row of table 2)
table2 paginating with header repeating on every page

For repeating the header of table2 on all the pages, I am using -fs-table-paginate:paginate which works. But how do I repeat table 1 and the text as per the requirement? Really appreciate the help in advance.

score 0 · Answer 1 · answered Oct 25 '21 at 07:11

You can either put the table 1 in the header of the page (it will appear on every page, not only on page containing table 2).

An other option is to include table 1 in the thead of table 2, with some CSS to make it appear as a separate table. For example:

<head>
    <style>
       td{border:1px solid red}
       #table1, #table1 td{border: 0}
       table{-fs-table-paginate:paginate;border-collapse: collapse}
    </style>
</head>
<body>
    <table id="table2">
        <thead>
        <!-- Table 1 -->
        <tr>
            <td id="table1">
                <table>
                <tr><td>Table1</td></tr>
                <tr><td>Value</td></tr>
                </table>
            </td>
        </tr>
        <!-- Header of table 2 -->
        <tr><td>Col name</td></tr>
        </thead>
        <tbody>
           (...)
        </tbody>
   </table>
</body>

Customize table pagination for Html to pdf conversion

1 Answers1