1

I have a webpage that I made using PHP and HTML with CSS, it is a document, When I try to save the doc as a PDF using Ctrl + p it works perfectly, but I want to add a button to the webpage that automates this task, when the user clicks that button, the PDF will be generated.

I tried Html2pdf.js but it just takes a screenshot of the page, is there any other method to generate PDF with selectable text? Or maybe automate the ctrl+p, remove header and save as PDF.

Peter O.
  • 32,158
  • 14
  • 82
  • 96
Skillmaker
  • 11
  • 1
  • seems like a duplicate of https://stackoverflow.com/questions/30711523/how-to-execute-keybord-shortcut-ctrl-p-by-clicking-a-link-using-jquery – Sakibul Alam Jul 05 '21 at 13:56
  • Does this answer your question? [How to execute keybord shortcut CTRL + P by clicking a link using jquery](https://stackoverflow.com/questions/30711523/how-to-execute-keybord-shortcut-ctrl-p-by-clicking-a-link-using-jquery) – Sakibul Alam Jul 05 '21 at 13:57

1 Answers1

0

You can use jsPDF

It will generate the selectable PDF of your whole HTML page.

Here is how you can install it

npm install jspdf --save

Include the following Scripts in your project:

  • jspdf.js
  • jspdf.plugin.from_html.js
  • jspdf.plugin.split_text_to_size.js
  • jspdf.plugin.standard_fonts_metrics.js

The code in index.html

<!DOCTYPE html>
<html>
  <body>
    <p id="ignorePDF">don't print this to pdf</p>
    <div>
      <p><font size="3" color="red">print this to pdf</font></p>
    </div>
  </body>
</html>

Following Javascript Code will open the popup and generate html to pdf.

var doc = new jsPDF();          
var elementHandler = {
  '#ignorePDF': function (element, renderer) {
    return true;
  }
};
var source = window.document.getElementsByTagName("body")[0];
doc.fromHTML(
    source,
    15,
    15,
    {
      'width': 180,'elementHandlers': elementHandler
    });

doc.output("dataurlnewwindow");

For Further Detail Read the Documentation here

bill
  • 118
  • 5