jsPDF generate pdf with multiple pages

Hello everybody. I use these version for jspdf: <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>

I have big div on my page , example of it is:

 <div id="template_invoice">
    <div id="first_head">
        <div id="logo_invoice" class="has-65">
            <img src="" width="280px">
        </div>
        <div id="main_header_info" class="has-35">
        </div>
    </div>
    <div class="clearFix"></div>
    <div id="second_head">
        <div id="lead_address" class="has-65">
            <span id="lead_name"></span><br>
            <span id="lead_street"></span><br>
            <span id="lead_postcode_city"></span><br>
        </div>
         <div id="lead_invoice_info" class="has-35">
            <div class="span_padding_invoice">
            <span class="invoice_main_span">Rechnungs-Nr.</span>
            <span id="lead_rechnungs_nr" class="right-clmn-span"></span>
            <br>
          ...
                </div>
            <div class="span_padding_invoice lead_total_container">
                <span class="invoice_main_span total_bold">Total</span>
                <span id="lead_total" class="right-clmn-span"></span>
                <br>
            </div>
        </div>
    </div>
    <div id="content_invoice">
 <div id="rechnung_div">
            <h1>Rechnung</h1>
            <p>Rechnungs-Nr. <span id="rechnung_nr"></span> / Kunden-Nr. <span id="kunder_nr"></span> </p>
        </div>
        <table id="product_invoice_table" width="100%">
                <thead>
			<tr>
                <th width="55%">Produkt</th>
                <th width="15%">Menge</th>
                <th width="15%">Preis / Einheit</th>
                <th width="15%">Total</th>
            </tr>
			</thead>
<tbody>
</tbody>
        </table>
     </div>
    <div class="clearFix"></div>
    <div id="footer_invoice">
    </div>
</div>

So I generate pdf file using below code: var doc = new jsPDF('p', 'pt', 'a4'); doc.addHTML($('#template_invoice')[0], function () { var pdf = doc.output('blob'); .... });

All works fine, but if height of cotent is larger then page there are not second,third… other pages. I tried use pagesplit:true, but it works wrong, there are not right font,css and instead of 2 pages I get 4 pages with wrong css.

I need any help to solve this problem, how can I set multiple page for my div?

Thanks very much for help!

Now I get such pdf with pagesplt flag: http://clip2net.com/s/3ObsVZc

[archervallesfin]

Found solution for this issue, its a long shot of debugging and testing but so far I found the line that causing the issue of why only 1 page is generated and the rest are empty.

You need to modify the recent version (as of Dec. 2017) jspdf.min.js itself Look for this code inside the minimized version: this.pdf.internal.getVerticalCoordinateString(this.y),e.color,"Td") then changed it to (just removing the e.color) this.pdf.internal.getVerticalCoordinateString(this.y),"","Td")

Let me know if this solve your issue.

[Uzlopak]

Solved by PR #1492 Merged on 11 January 2018 Will be part of next version.