All geek questions in one place

How to print a specific part of a page through window.print ()

I am working on a form in php mysql. therefore, on my page there is a form below that I showed the data of this form in table format. Now I want to print only the table structure, so I just made the PRINT button like:

<span style="float:right;"><a href="javascript:window.print()" type="button" class="btn">PRINT</a></span>

but it will print the whole page with the form field and table, and I just want the table to print. Here is the design of my entire page with a form and a table:

 <html> <head></head> <body> <div class="container"> <form class="form-horizontal" action="" method="post" name="userform1" id="company-form" enctype="multipart/form-data"> <?php if($_GET[id]){?> <fieldset> <legend>Add Company</legend> <div class="control-group"> <label class="control-label">Company Name</label> <div class="controls"> <input type="text" name="company" id="company" value="<?php echo $selup['company']?>"> </div> </div> <div class="control-group">another field</div> <div class="control-group">another field</div> <div class="control-group"> <div class="controls"> <button type="submit" class="btn" name="submit" id="submit" value="Submit">Submit</button> </div> </div> <table class="table table-bordered"> <tbody> <tr> <td>S.No.</td> <td>Company Name</td> <td>Type</td> <td>Action</td> </tr> <?php // to print the records $select = "select * from company where type='Miscellaneous'"; $query1 = mysql_query($select); while($value = mysql_fetch_array($query1)){ ?> <tr> <td><?php echo $value[id];?></td> <td><?php echo $value[company ];?></td> <td><?php echo $value[type];?></td> <!--<td>&nbsp;</td>--> <?php /*?><td><?php echo $value[amount];?></td> <td><?php echo $value[date];?></td><?php */?> <td><a href="<?php echo $_SERVER['PHP_SELF']; ?>?id=<?php echo $value[id];?>&cmd=edit"><i class="icon-edit"></i></a> <a href="<?php echo $_SERVER['PHP_SELF']; ?>?id=<?php echo $value[id];?>&cmd=delete" onclick="return confirm('Are you sure you want to delete <?php echo $value[customer];?>?')"><i class="icon-trash"></i></a></td> </tr><?php }?> </tbody> </table> </fieldset> <form> </div> </body>

so I just want to print a spreadsheet not a whole page.

+6
source share
4 answers

Use css to hide elements that you do not want to print:

 @media print { .control-group { display: none; } }
+9
source

You can do print-css (which does the same as @media print, but I think it is cleaner and you can disable css include via javascript if you need it):

 <link rel="stylesheet" type="text/css" href="print.css" media="print" />

In this css, you hide all elements that should not be printed, for example:

 .wrapper, .header {display: none;}
+3
source 
 function printContent(el){ var restorepage = document.body.innerHTML; var printcontent = document.getElementById(el).innerHTML; document.body.innerHTML = printcontent; window.print(); document.body.innerHTML = restorepage; } 
 <!DOCTYPE html> <html> <head> </head> <body> <h1>My page</h1> <div id="div1">DIV 1 content...</div> <button onclick="printContent('div1')">Print Content</button> <div id="div2">DIV 2 content...</div> <button onclick="printContent('div2')">Print Content</button> <p id="p1">Paragraph 1 content...</p> <button onclick="printContent('p1')">Print Content</button> </body> </html>
+3
source

One possible solution may not be the best option:

 1. Open a new window with JS 2. Copy the whole table into the new window (with jQuery for example) 3. Print the new window 4. Close the window

I am sure that it has a blinking effect, but it will work.

+2
source

Source: https://habr.com/ru/post/950694/

More articles:


All Articles