Friday, February 17, 2017

javascript print all page or print a page section

Hello everybody.

If we print all page using javascript we can use the next code:

 window.print();  

For example, we create the next Html code with a respective javascript.

 <!DOCTYPE html>  
 <html>  
 <body>  
 <p>print this</p>  
 <button onclick="printAll()">Print Page</button>  
 <script>  
 printAll = function(){  
   window.print();  
 }  
 </script>  
 </body>  
 </html>  

When we click on the button, the page can be print.

Now we want print a page section with javascript, we can use the next code:

 print = function(area){  
  var ficha=document.getElementById(area);  
  var ventimp=window.open(' ','popimpr');  
  ventimp.document.write(ficha.innerHTML);  
  ventimp.document.close();  
  ventimp.print();  
  ventimp.close();  
 }  

Here there is an example:

 <!DOCTYPE html>  
 <html>  
 <body>  
 <div id="area"><p>print this</p></div>  
 <p>No print this</p>  
 <button onclick="print('area')">Print Page</button>  
 <script>  
 print = function(area){  
  var ficha=document.getElementById(area);  
  var ventimp=window.open(' ','popimpr');  
  ventimp.document.write(ficha.innerHTML);  
  ventimp.document.close();  
  ventimp.print();  
  ventimp.close();  
 }  
 </script>  
 </body>  
 </html>  


When we click on button, we can print only the content of the div with id = area

No comments:

Post a Comment