Click here to Skip to main content
15,891,657 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am trying to create pdf from my web page. I am trying to use Html2Canvas to take image and then save as pdf using Jspdf. 
But for some reason my code does not work.

Please look at my code and try to help me out.


What I have tried:

<button class="create_pdf" myPrint="#canvas" id="btn">Export To PDF</button>
<script type="text/javascript">

        $(document).ready(function () {
            $(".create_pdf").on("click", function (e) {
                $('body').scrollTop(0);
                var selector = $(e.target).attr('myprint');
                createPDF(selector);
            });
        });



            var     form,  a4 = [595.28, 841.89]; // for a4 size paper width and height


            function createPDF(selector) {
                form = $(selector);
                getCanvas().then(function (canvas) {
                    var cache_width = form.width()

                    var
                     img = canvas.toDataURL("image/png"),
                     doc = new jsPDF({
                         unit: 'px',
                         format: 'a4'
                     });
                    doc.addImage(img, 'JPEG', 20, 20);
                    doc.save(TEst.pdf');
                    form.width(cache_width);
                });
            }

            // create canvas object
            function getCanvas() {

                form.width((a4[0] * 1.33333) - 80).css('max-width', 'none');
                return html2canvas(form, {
                    imageTimeout: 2000,
                    removeContainer: true
                });
            }

</script>
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900