10

I am trying to download a div value into PDF using jsPDF here are the code which I have written:

<html> <head> <script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script src="jsPDF.js"></script> <script> $(function () { var doc = new jsPDF(); var specialElementHandlers = { '#editor': function (element, renderer) { return true; } }; $('#cmd').click(function () { doc.fromHTML($('#content').html(), 15, 15, { 'width': 170, 'elementHandlers': specialElementHandlers }); doc.save('sample-file.pdf'); }); }); </script> </head> <body> <div id="content"> <h3>Hello, this is a H3 tag</h3> <p>a pararaph</p> </div> <div id="editor"></div> <button id="cmd">generate PDF</button> </body> </html>

But while clicking on the button nothing is happening...I have downloaded the jsPDF from this link.

I am clueless of thing can anyone please help me.

Improve this question

2 Answers 2

Reset to default
12

Pick jspdf.min.js from https://github.com/MrRio/jsPDF/tree/master/dist

Then this should work:

.... <script src="jspdf.min.js"></script> <script> $(function () { $('#cmd').click(function () { var doc = new jsPDF(); doc.addHTML($('#content')[0], 15, 15, { 'background': '#fff', }, function() { doc.save('sample-file.pdf'); }); }); }); </script> ....
Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

jspdf.min.js is nit available on the mentioned URL... The closest seems to be the jspdf.es.min.js... @diegocr
You're replying to an 8-years-old answer, jsPDF largely mutated in that time :) @Tauseef
2 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.js"></script> <script type="text/javascript" src="http://mrrio.github.io/jsPDF/dist/jspdf.debug.js"></script> <script type="text/javascript" src="http://html2canvas.hertzen.com/build/html2canvas.js"></script> <script type='text/javascript'>//<![CDATA[ $(window).load(function(){ $(document).ready(function() { $('#download').click(function() { html2canvas($("#canvas"), { onrendered: function(canvas) { var imgData = canvas.toDataURL('image/png'); $("#imgRes").attr("src", imgData); var doc = new jsPDF('p', 'mm'); doc.addImage(imgData, 'PNG', 10, 10); doc.save('sample-file.pdf'); } }); }); }); });//]]> </script>

and here is a HTML its working i tested it many times. and using this same code.

<img id="imgRes" height="500px" width="770px" /> <div id="canvas" style="background-image:url(fimage/1.jpg)"><br> <br> <br> <br> <br> <br> <br> <br> <br> <br> </div> <button id="download">Download Pdf</button>
Improve this answer

1 Comment

My this code is giving images as well. what ever u want you will get in pdf even u can get table as well.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.