JsPDF Tutorial to Convert Multiple Hidden DIV’s HTML With CSS Content to PDF Document Using FromHTML() In Javascript

You are currently viewing JsPDF Tutorial to Convert Multiple Hidden DIV’s HTML With CSS Content to PDF Document Using FromHTML() In Javascript

jsPDF Tutorial to Convert Multiple Hidden Div’s HTML With CSS Content to PDF Document Using fromHTML() in Javascript

<head>
  <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>
      <div style="color:red" hidden id="result">
        <h1>Hello World</h1>
      </div>
      <div style="color:red" hidden id="result2">
        <h1>Hello World</h1>
      </div>
      <button onclick="generatePDF()">Generate PDF</button>
  </body>
  <script type="text/javascript">
      function generatePDF() {
 
      var doc = new jsPDF();
 
      $("#result").removeAttr('hidden')
      $("#result2").removeAttr('hidden')
 
      doc.fromHTML(document.getElementById("result"),5,5)
      doc.fromHTML(document.getElementById("result2"),5,45)
 
      $("#result").attr('hidden', 'true')
      $("#result2").attr('hidden', 'true')
 
      doc.save("output.pdf")
      }
  </script>
  </body>
  </html>

Ranjith

Hi, I'm Manoj a full-time Blogger, YouTuber, Affiliate Marketer, & founder of Coding Diksha. Here, I post about programming to help developers.

Leave a Reply