We have been using this library for over a year and it's been working good.
There has been a user need to add big paragraphs to the content which gets generated to PDF. For this scenario we are facing an issue where if the text is too long and has a chance of spanning multiple pages, one lines gets chopped off partially. We have tried to set the values using breaks. The issue is it will be one single paragraph which is a user input using a rich text editor.
Any inputs would be highly appreciated.
I am providing the sample code we have use.
<html>
<head>
<script type="text/javascript" async="" src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.3/html2pdf.bundle.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>
<script>
var imag;
function jsPDFOffline() {
var element = document.getElementById('ActionHTML');
var opt = {
margin: 0.75,
//html2canvas: { scale: 1,logging:true},
//pagebreak: { mode: ['css']},
//pagebreak: { mode: 'avoid-all', before: '#page2el' },
//pagebreak: {mode: 'avoid-all', before:'#pageX'},
//pagebreak: {avoid: ['tr', 'table', 'div', 'p', 'span']},
//pagebreak: {avoid: 'tr'},
pagebreak: {avoid: ['tr','pre']},
image: { type: 'jpeg',quality: 0.98 },
html2canvas: { dpi: 192, letterRendering: true },
jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' }
};
var ReqIDforPDF = 'one';
var filenamePrefix = 'two';
var serviceDate = '2021';
var filename = filenamePrefix+"-"+ReqIDforPDF+"_"+serviceDate+".pdf";
var dynDivheight = document.getElementById('RTEText').offsetHeight;
var ptags = document.getElementById('RTEText').getElementsByTagName('p');
/*for (var i=0; i<ptags.length; i++) {
console.log(ptags[i].offsetHeight);
console.log(' '+ptags[i].innerHTML.length);
console.log(ptags[i].innerHTML);
ptags[i].style='background:red;'
}
var includeBrs = false;
if(dynDivheight>910){
includeBrs=true;
console.log('include breaks '+includeBrs);
}*/
window.html2pdf().set(opt).from(element).save(filename);
/*imag=window.html2pdf().set(opt).from(element).toImg();
var imglist = imag.thenList.then;
for (var i=0; i<imglist.length; i++) {
console.log(imglist[i]);
}
console.log(imag.outputImg);
document.write(imag.outputImg('img'));
*/
}
</script>
</head>
<body>
<button title="PDF" onclick="jsPDFOffline()">PDF</button>
<button title="PDF" onclick="Export2Doc()">Word Doc</button>
<div id="ActionHTML">
<img width="250" height="250">Test</img>
<div id="RTEText" style="width:672px;">
<p>html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.jshtml2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.jshtml2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.jshtml2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.jshtml2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.jshtml2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.jshtml2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js</p>
<p>html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles,selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js</p>
<p>html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles,selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js</p>
<p>html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles,selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js</p>
<p>html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles,selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js has the ability to automatically add page-breaks to clean up your document. Page-breaks can be added by CSS styles, set on individual elements using selectors, or avoided from breaking inside all elements (avoid-all mode). html2pdf.js</p>
<div>
<p> This if fourth tag
</p>
</div>
</div>
</div>
</body>
</html>
`
[two-one_2021.pdf](https://github.com/eKoopmans/html2pdf.js/files/7513707/two-one_2021.pdf)
``
Hello Development team,
We have been using this library for over a year and it's been working good.
There has been a user need to add big paragraphs to the content which gets generated to PDF. For this scenario we are facing an issue where if the text is too long and has a chance of spanning multiple pages, one lines gets chopped off partially. We have tried to set the values using breaks. The issue is it will be one single paragraph which is a user input using a rich text editor.
Has anyone encountered this type of an issue? Was there any work around?
Any inputs would be highly appreciated.
I am providing the sample code we have use.