Simplest way to generate a PDF of an HTML, client-side input

Question

Simplest way to generate a PDF of an HTML, client-side input

Navigation

#1 by (4 votes)
#2 by (2 votes)

6

I'm developing a web-based teaching material, and within it, there are some exercises where the user has to answer some questions by writing a brief dissertation within a Text Area.

After completing the exercise, I would like a PDF to be generated with this text that it has written, so that it can be downloaded to your computer. As you can see, the solution can be client-side.

It does not need to be generated from scratch. In this case, I can develop a PDF template, with style, fonts, colors, marks etc. and a field, which will be populated by this user input.

I ask this question because the procedure is really simple, it is not a complete form, the PDF will not have multiple pages, JavaScript will not necessarily have to stylize the PDF ...

However, I can not find simple solutions, jsPDF seemed a bit complicated for my request ...

javascript html pdf jspdf

asked by anonymous 03.03.2015 / 16:59

2 answers

How does a Container work? Should I limit the size of VARCHAR columns for performance?

score 4 · Answer 1

By taking the jsPDF project , there is nothing else for then serve your requirement to generate PDFs on the client side.

I do not know why you find jsPDF complicated, after all, starting and ending a document is fairly simple compared to more advanced server-side tools:

var doc = new jsPDF();                         // novo documento

doc.text("Bastante simples o jsPDF!", 35, 25); // algum texto

doc.save('verifica.pdf');                      // download

score 2 · Answer 2

The simplest one I've ever used was supposed to be jsPDF !.

I think jsPDF fits perfectly in what you need

Look how simple you can generate a PDF with so little code:

//Tão simples
var doc = new jsPDF();
// definir o tamanho da fonte...
doc.setFontSize(22);
// Adicionar texto
doc.text(20, 20, 'Meu PDF');
// adicionar outra pagina
doc.addPage();
// selecionar outro tamanho de fonte
doc.setFontSize(16);
// adicionar texto
doc.text(20, 30, 'Olá eu sou um texto!');