How to separate the print area for printing in javascript

Question

I am currently fetching the complete user details and lists it into a html table from the database table.I need to take the print of that particular list so i use the window.print() to do it. I place the entire html table which needed to be printed inside a div called <div id="printableArea"> and uses the following javascript to do the job.

function printDiv(printableArea)
     {
        var tabl = document.getElementById('tablePrint');
        var row = tabl.rows[0];
        var cell = row.cells[0];
        cell.innerHTML = '';
        var printContents = document.getElementById(printableArea).innerHTML;
        var originalContents = document.body.innerHTML;
        document.body.innerHTML = printContents;
        window.print();
        document.body.innerHTML = originalContents;
    }

But the problem is that i am getting the pagination button delete button in the bottom of the page along with the check boxes for selection corresponding to each row.How can i avoid those? Also i need to take the print out page to be in a grid format.

Need suggestions. Thanks in advance.

possible Dupe http://stackoverflow.com/questions/2255291/print-the-contents-of-a-div — Devjosh, Feb 10 '12 at 08:49

score 0 · Answer 1 · answered Feb 10 '12 at 08:55

0

you can put the buttons outside your printable div area. and use that printable area for printing only. you can jquery to do this. you can refer this: http://www.gontztech.com/tips-and-instructions/web-design-tips-and-tutorials/printing-a-specific-section-of-web-page-without-hiding-any-content.html

answered Feb 10 '12 at 08:55

rajesh

2,354
1
12
15

Thanks for the reference rajesh – Jimmy M Feb 11 '12 at 06:39

score 0 · Accepted Answer · edited May 23 '17 at 09:59

0

I'd suggest hiding them. Then, when printing is over, show them again, if need be.

This can be done in 2 ways:

Load another stylesheet, which hides the unneeded div's

either this or this should do it

Hide them via Javascript like so (using jQuery):

$('#idOfDivToHide').hide();

edited May 23 '17 at 09:59

Community

1
1

answered Feb 10 '12 at 08:57

Janis Peisenieks

4,938
10
55
85

How to separate the print area for printing in javascript

2 Answers2