I am new in JSPDF and creating a page of PDF like this Now Problem is that when data is full on this page it didn't produce new page. I have that github and other solutions on stack overflow. but not getting solution. [JSPDF demo link is here][3]
[3]: > https://jsfiddle.net/jodfkz59/7/
var data = [{
"Name": "Ronan",
"Email": "[email protected]",
"Company": "Malesuada Malesuada Ltd"
}, {
"Name": "Calvin",
"Email": "[email protected]",
"Company": "Donec Egestas Foundation"
}, {
"Name": "Kane",
"Email": "[email protected]",
"Company": "Arcu Institute"
}, {
"Name": "Kasper",
"Email": "[email protected]",
"Company": "Tempor LLP"
}];
var doc = new jsPDF('p', 'pt', 'a4');
//Dimension of A4 in pts: 595 × 842
var pageWidth = 595;
var pageHeight = 842;
var y=500;
var pageMargin = 10;
pageWidth -= pageMargin * 2;
pageHeight -= pageMargin * 2;
var cellMargin = 5;
var cellWidth = 250;
var cellHeight = 60;
var startX = pageMargin;
var startY = pageMargin;
function createCard(item) {
// doc.getTextDimensions(item.Name); turncate or split string if you needed
if (y >= pageHeight)
{
doc.addPage();
y = 0 // Restart height position
}
doc.text(item.Name, startX, startY);
doc.text(item.Email, startX, startY + 20);
doc.text(item.Company, startX, startY + 40);
var nextPosX = startX + cellWidth + cellMargin;
if (nextPosX > pageWidth) {
startX = pageMargin;
startY += cellHeight;
} else {
startX = nextPosX;
}
}
for (var i = 0; i < data.length; i++) {
createCard(data[i]);
}
The problem is in the condition in the function createCard
. You have to change your test on your real current value of y offset.
See this fiddle : https://jsfiddle.net/jodfkz59/8/
var data = [{
"Name": "Ronan",
"Email": "[email protected]",
"Company": "Malesuada Malesuada Ltd"
}, {
"Name": "Calvin",
"Email": "[email protected]",
"Company": "Donec Egestas Foundation"
}, {
"Name": "Kane",
"Email": "[email protected]",
"Company": "Arcu Institute"
}, {
"Name": "Kasper",
"Email": "[email protected]",
"Company": "Tempor LLP"
}];
var doc = new jsPDF('p', 'pt', 'a4');
//Dimension of A4 in pts: 595 × 842
var pageWidth = 595;
var pageHeight = 842;
var y=500;
var pageMargin = 10;
pageWidth -= pageMargin * 2;
pageHeight -= pageMargin * 2;
var cellMargin = 5;
var cellWidth = 250;
var cellHeight = 60;
var startX = pageMargin;
var startY = pageMargin;
function createCard(item) {
// doc.getTextDimensions(item.Name); turncate or split string if you needed
if (startY >= pageHeight)
{
doc.addPage();
startY = pageMargin // Restart height position
}
doc.text(item.Name, startX, startY);
doc.text(item.Email, startX, startY + 20);
doc.text(item.Company, startX, startY + 40);
var nextPosX = startX + cellWidth + cellMargin;
if (nextPosX > pageWidth) {
startX = pageMargin;
startY += cellHeight;
} else {
startX = nextPosX;
}
}
for (var i = 0; i < data.length; i++) {
createCard(data[i]);
}