In this post i will explan a Easy to create pdf by using javascript which can be used in your next web application. PDF (Portable Document Format) is a file format that has captured all the elements of a printed document as an electronic image that you can view, navigate, print, or forward to someone else.
You can download library from http://jspdf.com/
After downloading the library create a HTML or PHP file in example folder and paste below code.It already as many examples. but sharing this code ,because we can,t add edit or alter code.but we can add function to work according to our condition.because we can replace or change other option in save on disk button.one more think we can add PHP variable in it to create PDF file with PHP content.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 |
<!doctype> <html> <head> <title>jsPDF</title> <link rel=”stylesheet” type=”text/css” href=”css/main.css”> <script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js”></script> <script type=”text/javascript” src=”../libs/downloadify/js/swfobject.js”></script> <script type=”text/javascript” src=”../libs/base64.js”></script> <script type=”text/javascript” src=”../jspdf.js”></script> <script type=”text/javascript” src=”../libs/downloadify/js/downloadify.min.js”></script> </head> <body> <input id=”notify_checkbox” type=”checkbox” value=”y” name=”notify”> <?php $varible="http://freewebmentor.com"; ?> <script type=”text/javascript”> $(‘#notify_checkbox’).change(function() { if($(‘#notify_checkbox’).is(‘:checked’)) { Downloadify.create(‘downloadify’,{ filename: ‘Example.pdf’, data: function(){ var doc = new jsPDF(); doc.text(20, 20, <?php echo $varible;?>’); doc.addPage(); doc.text(20, 20, ‘Do you like that?’); return doc.output(); }, onComplete: function(){ alert(‘Your File Has Been Saved!’); }, onCancel: function(){ alert(‘You have cancelled the saving of this file.’); }, onError: function(){ alert(‘You must put something in the File Contents or there will be nothing to save!’); }, swf: ‘../libs/downloadify/media/downloadify.swf’, downloadImage: ‘../libs/downloadify/images/download.png’, width: 100, height: 30, transparent: true, append: false }); } else { $( “#downloadify” ).html( “<p>Okay, we email you.</p>” ); } }); </script> </body> </html> |
Do like & share it with your friends on social media. Don’t forget to follow us on Facebook and Twitter to learn cool tutorials.
If you like FreeWebMentor and you would like to contribute, you can write an article and mail your article to [email protected] Your article will appear on the FreeWebMentor main page and help other developers.
Article Tags: create pdf from web page, how to create a pdf of a web page, how to create pdf from web page, how to make a pdf from a web page, how to make a web page a pdf, javascript tutorials, Javasrcipt, online pdf creater