By: Prem Tiwari | Last Updated: | In: Freebies, Javascript & Ajax, Web Technologies
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="https://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.
Prem Tiwari is the founder of FreeWebMentor.com and also a professional developer who has vast experience in PHP and open source technologies. Apart from this, he is a blogger by hobby and also he has been a regular speaker of WordPress sessions in various IT Companies. View all posts by Prem Tiwari
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
