Breaking News: Grepper is joining You.com. Read the official announcement!

How trigger browser to make a PDF from HTML using window.print() in Javascript

OHIOLee answered on October 5, 2022 Popularity 8/10 Helpfulness 2/10

answer How trigger browser to make a PDF from HTML using window.print() in Javascript

related How trigger browser to make a PDF from HTML using window.print()

How trigger browser to make a PDF from HTML using window.print() in Javascript

Comment

document.addEventListener("DOMContentLoaded", () => {
    let printLink = document.getElementById("print");
    let container = document.getElementById("container");

    printLink.addEventListener("click", event => {
        event.preventDefault();
        printLink.style.display = "none";
        window.print();
    }, false);

    container.addEventListener("click", event => {
        printLink.style.display = "flex";
    }, false);

}, false);

Popularity 8/10 Helpfulness 2/10 Language javascript

Source: Grepper

Tags: browser html javascript pdf using

Link to this answer
Share Copy Link

Contributed on Oct 05 2022

OHIOLee

0 Answers Avg Quality 2/10

Closely Related Answers

How trigger browser to make a PDF from HTML using window.print()

Comment

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
    * {
    font-family: Arial, Helvetica, sans-serif;
    color: rgb(65, 65, 65);
    -webkit-print-color-adjust: exact !important;
    color-adjust: exact !important;
    print-color-adjust: exact !important;
	}

	@media print {
   		@page {
     		margin-left: 0.8in;
     		margin-right: 0.8in;
     		margin-top: 0;
     		margin-bottom: 0;
   		}
	}

	#container {
    	width: 800px;
    	margin: 0 auto;
	}
    </style>
    <title>This will be the title of the pdf file</title>
</head>

<body id="container">

    <a href="#" id="print">GENERATE PDF!</a>

    <h1>Super cool custom pdf</h1>

    <p>This pdf is generated from the client side without any external libraries!</p>

<script>
	document.addEventListener("DOMContentLoaded", () => {
    	let printLink = document.getElementById("print");
    	let container = document.getElementById("container");

    	printLink.addEventListener("click", event => {
        	event.preventDefault();
        	printLink.style.display = "none";
        	window.print();
    	}, false);

    	container.addEventListener("click", event => {
        	printLink.style.display = "flex";
    	}, false);

	}, false);
</script>

</body>
</html>

Popularity 3/10 Helpfulness 1/10 Language html

Source: Grepper

Tags: browser pdf using html

Link to this answer
Share Copy Link

Contributed on Oct 05 2022

OHIOLee

0 Answers Avg Quality 2/10

How trigger browser to make a PDF from HTML using window.print() in Javascript

Contents

More Related Answers

How trigger browser to make a PDF from HTML using window.print() in Javascript

Closely Related Answers

How trigger browser to make a PDF from HTML using window.print()

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.