Click here to Skip to main content
14,390,083 members
Rate this:
Please Sign up or sign in to vote.
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, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100