jsPDF: Generating your PDF Web Page Documents using JavaScript

JavaScriptBank

Bannato
26 Nov 2009
86
0
0
<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
Codice:
<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: Place HTML below in your BODY section
HTML
Codice:
<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 metadata</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






 
Discussioni simili
Autore Titolo Forum Risposte Data
S impostare un testo e una img nella stessa riga con jsPDF Javascript 0
bubino8 [Javascript] jsPDF Con nome al salvataggio Javascript 2
I cartella sottocartella apri o scarica file pdf PHP 1
G Come modificare un pdf in php PHP 1
FDF182 Inserire pdf in db PHP 3
E Scrivere una data corrente in un pdf PHP 1
X unire più file in un pdf Windows e Software 2
8 Javascript - PDF Form Javascript 0
B javascript per problemi con pdf e Safari Javascript 0
B Crea pdf da tabella mysql "ultima riga modificata" MySQL 4
zorro file PDF non visualizzo niente PHP 9
I eliminazione file pdf PHP 0
M Visualizzare file PDF con link preso dal DB PHP 0
D File pdf che non si aprono .... PHP 1
S Modificare intestazione documento pdf con LO Draw Linux e Software 0
B Google Analytics - track visualizzazioni pdf Google Analytics 0
P Librerie pdf dompdf o tcpdf. PHP 8
Y Problema visualizzazione PDF generato da fpdf PHP 1
N PDF fpdi passare variabile PHP 4
N Scrivere su file PDF PHP 4
W Stampare file PDF in varie modalità. Windows e Software 5
felino Esportare tabella HTML in PDF, quale libreria usare? Javascript 1
D SALVARE "MASCHERA" + "ALLEGATO PDF" IN UN UNICO PDF MS Access 0
G Come ridurre almento al 30% un file pdf Windows e Software 1
B [PHP] Creare PDF dopo inserimento dati form PHP 4
G Importazione PDF in Photoshop Presentati al Forum 0
max1974 [Javascript] Datatables Export PDF Column Javascript 0
E percorso assoluto pdf su server apache Apache 0
S [OFFRO] Rimozione o aggiunta di Password ai file PDF e opzionalmente loro modifica Offerte e Richieste di Lavoro e/o Collaborazione 2
spider81man [PHP] Inserire file .pdf in db PHP 6
I [PHP] visualizza file pdf in una cartella e download PHP 7
M [Visual Basic] Cercare un file pdf all'interno di una cartella attraverso il valore di una txtbox Visual Basic 1
J modifica spooler di stampa per stampare in ordine di nome i files pdf Windows e Software 2
G [HTML] Apertura PDF HTML e CSS 8
A [PHP] FPDF error: Some data has already been output, can't send PDF file PHP 5
zorro [PHP] Conversione PDF-JPG PHP 6
Matteo Lorenzon [PHP][WORDPRESS] Form in Wordpress, creazione PDF con dati del form ed invio tramite email WordPress 1
I [PHP] download documento pdf per ogni operaio PHP 4
L PHP e modulo PDF PHP 1
S Creare in automatico PDF da MySQL PHP 2
9 inserire contenuto in un file pdf aperto sul browser tramite script php PHP 0
L microsoft print PDF Windows e Software 18
cris8380 [PHP] Generare file pdf con inserimento dati PHP 34
D PDF sfogliabile con jQuery jQuery 0
M Creare stampe pdf con tabelle relazione uno a molti PHP 0
A Creare da form un PDF da inviare come allegato. PHP 1
S pdf in php PHP 1
D download file pdf da mysql con php PHP 1
Licantropo Scansioni da riviste e files PDF Windows e Software 5
T Compilare "form PDF" in php PHP 2

Discussioni simili