Skip to content

WebNinjaDeveloper.com

Programming Tutorials




Menu
  • Home
  • Youtube Channel
  • Official Blog
  • Nearby Places Finder
  • Direction Route Finder
  • Distance & Time Calculator
Menu

jsPDF Tutorial to Add Multiple Pages inside PDF Document in Browser Using Javascript

Posted on December 16, 2022

 

 

Welcome folks today in this blog post we will be adding multiple pages inside pdf document in browser using javascript. All the full source code of the application is shown below.

 

 

Get Started

 

 

In order to get started you need to make an index.html file and copy paste the following code

 

 

index.html

 

 

1
2
3
4
5
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://parall.ax/parallax/js/jspdf.js"></script>
<body>
  <button onclick="generatePDF()">Generate PDF</button>
</body>

 

 

As you can see in the above html code we are including the jspdf cdn and then we have the simple button to generate the pdf document.

We have binded a onclick event listener. We now have to define the generatePDF() method which is as follows

 

 

JavaScript
1
2
3
4
5
6
7
8
9
10
11
function generatePDF() {
  
        
          var doc = new jsPDF('p', 'pt', 'letter');
          
          doc.text("this is the first page",10,50)
          doc.addPage()
          doc.text("this is the second page",10,50)
          doc.addPage()
          doc.save("output.pdf")
      }

 

 

As you can see in the above javascript code we are making a new object of the jsPDF class and then we add the text using the text() method and now add to add a new page inside the pdf document using the addPage() method. And after that we need to save the pdf document using the save() method

 

 

 

Recent Posts

  • Android Java Project to Merge Multiple PDF Documents From Gallery Using iTextPDF Library
  • Android Java Project to Detect System Hardware & System CPU Info & Display inside TextView Widget
  • Android Java Project to Integrate Google OAuth2 Login & Logout System & Save User Info in SharedPreferences
  • Android Java Project to Export Raw Text to PDF Document Using iTextPDF Library
  • Android Java Project to Export Images From Gallery to PDF Document Using iTextPDF Library
  • Angular
  • Bunjs
  • C#
  • Deno
  • django
  • Electronjs
  • java
  • javascript
  • Koajs
  • kotlin
  • Laravel
  • meteorjs
  • Nestjs
  • Nextjs
  • Nodejs
  • PHP
  • Python
  • React
  • ReactNative
  • Svelte
  • Tutorials
  • Vuejs




©2023 WebNinjaDeveloper.com | Design: Newspaperly WordPress Theme