Hi Guys,
I am using the print sample to produce printed / PDF invoices.
I am creating a header that has BS row & 3 columns
Left column blank (33% width)
Middle column with label (34% width)
Right Column image ( 33% width)
I have a container ( width 100%) with a datatable (width 100%)
I use the following code
var pdf = new jsPDF('p', 'mm', [297, 210]);
Button1.onclick = function() {
nsbDOMAttr(Form1, 'style.display', "none");
nsbDOMAttr(formPrint, 'style.display', "block");
pdf.addHTML(document.body, handlePDFdone());
};
function handlePDFdone() {
pdf.save();
nsbDOMAttr(formPrint, 'style.display', "none");
nsbDOMAttr(Form1, 'style.display', "block");
}
Button2.onclick=function(){
// need to hide everything except the rows and headers
data1 = [["Tom","Upright",'<h1><img alt="Saturn V carrying Apollo 11" class="right" src="assets/sample.jpg" /> Apollo 11</h1><p><strong>Apollo 11</strong> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.</p><p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5 kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p>',"http://www.surplusanywhere.com/AppResources/ZMHsurplusAnywhereSkype2.png"],["Andy","Upright","5555","http://cdn2-www.dogtime.com/assets/uploads/2011/01/file_23244_what-is-the-appenzeller-sennenhunde-dog-300x189.jpg"],["John","Upright","5555","http://cdn2-www.dogtime.com/assets/uploads/2011/01/file_23244_what-is-the-appenzeller-sennenhunde-dog-300x189.jpg"],["Paul4","Upright","5555","http://cdn2-www.dogtime.com/assets/uploads/2011/01/file_23244_what-is-the-appenzeller-sennenhunde-dog-300x189.jpg"],["Paul5","Upright","5555","http://cdn2-www.dogtime.com/assets/uploads/2011/01/file_23244_what-is-the-appenzeller-sennenhunde-dog-300x189.jpg"],["Paul6","Upright","5555","http://cdn2-www.dogtime.com/assets/uploads/2011/01/file_23244_what-is-the-appenzeller-sennenhunde-dog-300x189.jpg"],["Paul7","Upright","5555","http://cdn2-www.dogtime.com/assets/uploads/2011/01/file_23244_what-is-the-appenzeller-sennenhunde-dog-300x189.jpg"],["Paul8","Upright","5555","http://cdn2-www.dogtime.com/assets/uploads/2011/01/file_23244_what-is-the-appenzeller-sennenhunde-dog-300x189.jpg"]]
$("#DataTable2").dataTable().fnDestroy();
$('#DataTable2').empty();
table = $('#DataTable2').DataTable( {
// order: [[0, 'desc']],
// dom: 'Bfrtip',
responsive: true,
autoWidth: true,
scrollCollapse: false,
paging: false,
info: false,
select: false,
ordering: false,
searching: false,
autoWidth : true,
data: data1,
"columnDefs": [
{
"title" : 'Salary',
width : "10%",
"targets": 2,
"data": 2
},
{
"title" : 'Link',
width : "60%",
"targets": 3,
"data": 3,
"render": function ( data, type, row, meta )
{
return '<img src="'+data+'" style="height:150px;width:150px;"/>'
}
},
{
"title" : 'Position',
width : "10%",
"targets": 1,
"data": 1
},
{
"title" : 'Name',
//width : "10%",
"targets": 0,
"data": 0
},
{
"targets": 4,
width : "10%",
"data": null,
"defaultContent": "<button>Click!</button>"
}
]
} );
This produces nearly what I need. If I reduce or expand the screen width the formatting changes ( eg the header contents move , the datatable font reduces / enlarges and the amount of text in each row changes).
The issue is here on different screen sizes I get different results.
I have tried various options / making the form modal / changing the form size type etc.
So how can I say.
Make the form fix to A4 size. ( 297mm X 210mm) so the PDF is produced at this size.
Cheers
Steve Warby
Print2PDF1.nsx (759.6 KB)
