CODEWITHSUNDEEP
javascripthtmlcsspdfdownload
nxt
nxt

Reputation: 436

JS: How Can I Convert HTML Element Into A PDF

I need to download This HTML & CSS page as PDF. When User Click this Button

const btn = document.querySelector("button");
table{
  border:1px solid black;
  border-radius: 10px;
  width: 100%;
  padding: 10px;
}
<div id="pdf_content">
<center><h1>Customers</h1></center>
  <table>
    <tr>
      <td>No</td>
      <td>Name</td>
      <td>Phone</td>
    </tr>
    <tr>
      <td>01</td>
      <td>Test01</td>
      <td>+44712365478</td>
    </tr>
    
  </table>  
</div>
<br>
<button>Download PDF</button>

Is there any Plugins or Functions for This

Upvotes: 1

Views: 1349

Answers (2)

ivanKClausen
ivanKClausen

Reputation: 36

You could use the jQuery and jsPDF Library:

<script src="js/jquery.min.js"></script>

<script src="js/jsPDF/dist/jspdf.min.js"></script>

Instantiate jsPDF class:

var doc = new jsPDF();

Retrieve the HTML content from the specific element by ID or class. Convert HTML content of the specific part of the web page and generate PDF. Save and download the HTML content as a PDF file.

Upvotes: 2

simon574
simon574

Reputation: 78

There is no easy way to convert to PDF directly. You can call window.print() however, which will open the print dialog of the user's browser. On most modern systems, there is a PDF printer preinstalled.

Upvotes: 1

Related Questions