Print page ( from samples)

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() {;
 nsbDOMAttr(formPrint, 'style.display', "none");
 nsbDOMAttr(Form1, 'style.display', "block");

// 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="">Neil Armstrong</a> and <a href="">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&nbsp;kg) of lunar material for return to Earth. A third member of the mission, <a href="">Michael Collins</a>, piloted the <a href="">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p>',""],["Andy","Upright","5555",""],["John","Upright","5555",""],["Paul4","Upright","5555",""],["Paul5","Upright","5555",""],["Paul6","Upright","5555",""],["Paul7","Upright","5555",""],["Paul8","Upright","5555",""]]
   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.


Steve Warby

Print2PDF1.nsx (759.6 KB)

Another issue is the quality of the print is low. ( the text is not at all crisp ) any setting for the quality of output ?


Steve Warby