Print in separate page javascript?

Question

I am currently using php and getting complete user details and displays it into a html table. The problem that I have is when I print 3 tables each of them are printed on each page perfectly. But when I try to print over 3 tables, each table moves upwards and the tables are printed partially on each page (1 ½ user details in each page). I have given a fixed height for the table but still displays partially.

Can someone please suggest a javascript that will print a single html table in one page?

Answer 1

One way you could do that would be to create a new document (perhaps in an invisible iframe), dump the table's contents there and call .print() on the iframe.

As DA pointed out, you could manipulate the print CSS; by hiding everything but the table you want to print, but that might not work across browsers.

Answer 2

JavaScript has no effect on printing other than you can call the browser's print dialogue in some cases.

Print CSS may help, but even that isn't fully supported or consistent across all browsers (cough IE cough)

If you want to retain absolute control of the printed piece, this is one of the few instances where I'd recommend PDFs. Have your PRINT link on your web page make a call back to the server, regrab the data, and then format in a PDF and stream back to the browser.

Answer 3

The problem with printing in the browser is that what you see is not always what you get. People have different printer settings and resolutions, and what might fit perfectly on one user's paper may be completely off on another's. There is no foolproof way to do this in HTML.

The best way to make the printed document 100% perfect is to generate a PDF. There are many tools for creating PDF documents in PHP--a Google search will get you where you need to go.

Answer 4

The best way to do this is using CSS. CSS3 has a page-break-after: always property which you can apply to your table (see also http://www.w3schools.com/CSS/pr_print_pageba.asp). Note that its support by the different browsers isn't yet what it should be, but IE8 and current versions of the others should support it.