Skip to main content

How to Generate a PDF with JavaScript

In this tutorial, we are going to download a portion the web page as a PDF file.  I downloaded the packaged html2pdf JavaScript library straightforwardly and imported it in the web page. You can use the cdn directly too. https://raw.githack.com/eKoopmans/html2pdf/master/dist/html2pdf.bundle.js

<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>HTML to PDF Eample</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="html2pdf.bundle.min.js"></script>
 
<script>
function generatePDF() {
// Choose the element that our invoice is rendered in.
const element = document.getElementById("invoice");
// Choose the element and save the PDF for our user.
html2pdf()
.from(element)
.save();
}
</script>
</head>
<body>
<button onclick="generatePDF()">Download as PDF</button>
<div id="invoice">
<h1>Our Invoice</h1>
</div>
</body>
</html>

Comments

Popular posts from this blog

Send email from React without backend

  This React tutorial will guide you to create a contact us form in a react application without a server. A third-party service called EmailJS will be used to send emails. If you have any doubts, please comment below. Please subscribe to my YouTube channel and link the video and share. Happy learning!!! Thank you. react emailjs example emailjs react tutorial emailjs react npm react emailjs-com emailjs in react emailjs with react

Top 10 JavaScript frameworks

  JavaScript is one of the most popular programming languages in the world, and it is used for a wide range of applications, from web development to mobile app development to desktop applications. With the increasing popularity of JavaScript, a number of JavaScript frameworks have emerged, each with its own set of features and capabilities. In this article, we will take a look at the top 10 JavaScript frameworks that are widely used by developers today. React.js React.js is a JavaScript library for building user interfaces. It is one of the most popular JavaScript frameworks, and it is used by many major companies such as Facebook, Netflix, and Airbnb. React allows developers to build reusable UI components and manage the state of their applications. It also has a large and active community, making it easy to find help and resources. Angular Angular is a complete JavaScript framework for building web applications. It is maintained by Google and is used by many large companies su...