download() {
var element = document.getElementById("element-to-print");
html2pdf()
.from(element)
.set({
margin: [25, 15, 15, 15],
filename: '<?=$fname;?> as <?=trim(date("dmY"));?>.pdf',
image: { type: "jpeg", quality: 0.98 },
html2canvas: {
scale: 2,
logging: true,
dpi: 192,
letterRendering: true,
},
jsPDF: { unit: "mm", format: "a4", orientation: "p" },
pagebreak: { before: ".page-break", avoid: "table" },
header: {
height: "20mm",
contents: function (page, totalPages) {
// Generate header content here
return '<div style="text-align: center;">Header Content</div>';
},
},
footer: {
height: "15mm",
contents: function (page, totalPages) {
// Generate footer content here
return (
'<div style="text-align: center;">Footer Content - Page ' +
page +
" of " +
totalPages +
"</div>"
);
},
},
})
.toPdf()
.get("pdf")
.then(function (pdf) {
var totalPages = pdf.internal.getNumberOfPages();
for (let i = 1; i <= totalPages; i++) {
pdf.setPage(i);
pdf.setFontSize(8);
pdf.setTextColor(150);
pdf.text(0, 10, "[SULIT]");
pdf.text(
'Tarikh Cetakan: <?=trim(date("d/m/Y h:i A"));?> | Mukasurat: ' +
i +
"/" +
totalPages +
"",
pdf.internal.pageSize.getWidth() - 85,
pdf.internal.pageSize.getHeight() - 7
);
}
})
.save();
},
I am trying to create pdf using html2pdf. In the given example the header and footer is text. instead of text. Is there any way to include HTML part as header and footer? To make my pdf more specific.