CODEWITHSUNDEEP
javascripthtml
M2K
M2K

Reputation: 33

Why does it print only one time? Please give me solution

<html>
<head>
<script type="text/javascript">
    function printpage()
        {document. getElementById ('print').style.display='none';
        window.print()
    }
</script>
</head>
<body>
  <td align="center">
    <input  name="print" type="submit" id="print" value="PRINT" onclick="printpage()" />
  </td>
</body>
</html>

When I click, it will open a print window. Once I close print window and open it again and then click on print, without reloading, then it will not work.

Upvotes: 1

Views: 3337

Answers (3)

Ahsan Khurshid
Ahsan Khurshid

Reputation: 9469

Remove document.getElementById('print').style.display='none'; from your printpage() function.

In the above case the button will be visible for another click event but when you will print the document, the button will be shown on printed document. Am I right?

To prevent printing the print button you need to use css media queries @media print

Add following in your extrernal stylesheet OR in <style> tag inside a <head> tag of the HTML page:

 @media print {    
     .noprint { display: none; }
 }​

and add .noprint class on

<input  name="print" class="noprint" type="submit" id="print" value="PRINT" onclick="printpage()" />

SEE DEMO

It will print the document without printing the button and your button will also be visible for the second time click :-)

EDITED:

USE HTML AS GIVEN BELOW:

<!DOCTYPE html>
<html>
    <head>

      <meta charset=utf-8 />  
      <title>JS Bin</title>  

      <!-- Your Stylesheet (CSS) -->  
      <style type="text/css">
         @media print {    
           .noprint { display: none; }
         }​
      </style>

      <!-- Your Javascript Function -->  
      <script>
          function printpage() {       
              window.print();
          }
      </script>

    </head>
<body>

<!-- Your Body -->
<p>Only This text will print</p>

<!-- Your Button -->
<input class="noprint" type="button" value="PRINT" onclick="printpage()" />

</body>
</html>

SEE ABOVE CODE IN ACTION

Upvotes: 7

mplungjan
mplungjan

Reputation: 177688

Change type=submit to type=button

You are unloading the page when submitting

And hide the button with CSS as posted by A.K.

Upvotes: 1

Bhuvan Rikka
Bhuvan Rikka

Reputation: 2703

Just remove 

document.getElementById('print').style.display='none';

from your printpage() function. It'll work fine

If you don't want the print button on your printed page,

document.getElementById('print').style.visibility='hidden'
window.print();
document.getElementById('print').style.visibility='visible'

Upvotes: 0

Related Questions