Mark Forums Read
  #1  
Old 09-10-2010, 12:41 AM
JavaScriptBank JavaScriptBank is offline
Senior Member
 
Join Date: Sep 2009
Posts: 130
JavaScriptBank is on a distinguished road
Default jsPDF: Generating your PDF Web Page Documents using JavaScript

<b>jsPDF</b> is an open-source JavaScript library written by <i>James</i>, this tool allow us generate PDF web page documents in server-side and client-side by using nothing... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


How to setup

Step 1: Use JavaScript code below to setup the script
JavaScript
Code:
<script type="text/javascript" src="base64.js"></script> <script type="text/javascript" src="sprintf.js"></script> <script type="text/javascript" src="jspdf.js"></script> <script type="text/javascript"> function demo1() { var doc = new jsPDF(); doc.text(20, 20, 'Hello world!'); doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.'); doc.addPage(); doc.text(20, 20, 'Do you like that?'); // Output as Data URI doc.output('datauri'); } function demo2() { var doc = new jsPDF(); doc.setFontSize(22); doc.text(20, 20, 'This is a title'); doc.setFontSize(16); doc.text(20, 30, 'This is some normal sized text underneath.'); // Output as Data URI doc.output('datauri'); } function demo3() { var doc = new jsPDF(); doc.text(20, 20, 'This PDF has a title, subject, author, keywords and a creator.'); // Optional - set properties on the document doc.setProperties({ title: 'Title', subject: 'This is the subject', author: 'James Hall', keywords: 'generated, javascript, web 2.0, ajax', creator: 'MEEE' }); // Output as Data URI doc.output('datauri'); } function demo4() { var name = prompt('What is your name?'); var multiplier = prompt('Enter a number:'); multiplier = parseInt(multiplier); var doc = new jsPDF(); doc.setFontSize(22); doc.text(20, 20, 'Questions'); doc.setFontSize(16); doc.text(20, 30, 'This belongs to: ' + name); for(var i = 1; i <= 12; i ++) { doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ___'); } doc.addPage(); doc.setFontSize(22); doc.text(20, 20, 'Answers'); doc.setFontSize(16); for(var i = 1; i <= 12; i ++) { doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ' + (i * multiplier)); } doc.output('datauri'); } </script>
Step 2: Copy & Paste HTML code below in your BODY section
HTML
Code:
<h2>Simple Two-page Text Document</h2> <pre>var doc = new jsPDF(); doc.text(20, 20, 'Hello world!'); doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.'); doc.addPage(); doc.text(20, 20, 'Do you like that?'); // Output as Data URI doc.output('datauri');</pre> <a href="javascript:demo1()">Run Code</a> <h2>Different font sizes</h2> <pre>var doc = new jsPDF(); doc.setFontSize(22); doc.text(20, 20, 'This is a title'); doc.setFontSize(16); doc.text(20, 30, 'This is some normal sized text underneath.'); // Output as Data URI doc.output('datauri');</pre> <a href="javascript:demo2()">Run Code</a> <h2>Adding ****data</h2> <pre>var doc = new jsPDF(); doc.text(20, 20, 'This PDF has a title, subject, author, keywords and a creator.'); // Optional - set properties on the document doc.setProperties({ title: 'Title', subject: 'This is the subject', author: 'James Hall', keywords: 'generated, javascript, web 2.0, ajax', creator: 'MEEE' }); // Output as Data URI doc.output('datauri');</pre> <a href="javascript:demo3()">Run Code</a> <h2>Example of user input</h2> <pre>var name = prompt('What is your name?'); var multiplier = prompt('Enter a number:'); multiplier = parseInt(multiplier); var doc = new jsPDF(); doc.setFontSize(22); doc.text(20, 20, 'Questions'); doc.setFontSize(16); doc.text(20, 30, 'This belongs to: ' + name); for(var i = 1; i <= 12; i ++) { doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ___'); } doc.addPage(); doc.setFontSize(22); doc.text(20, 20, 'Answers'); doc.setFontSize(16); for(var i = 1; i <= 12; i ++) { doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ' + (i * multiplier)); } doc.output('datauri');</pre> <a href="javascript:demo4()">Run Code</a>
Step 3: Download files below
Files
base64.js
jspdf.js
sprintf.js






Reply With Quote
 #Add to Ads's Reputation  
OldSponsored Ads
Ads AdsPromoter is online
Member
 
Join Date: LongTime
Posts: 1100
Ads is on a distinguished road
Default New Sponsored Ads



This message will go away once you are registered. Also, by registering, you will have access to all post topics, communicate privately with other members (PM), respond to polls, upload graphics, and access other special features! Registration is fast, simple and absolutely free so please Click Here to join our Web Hosting community today!
Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT. The time now is 05:51 PM.


Powered by vBulletin Version 3.6.1
Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.
SEO by vBSEO 2.4.0