hide a control when printing the page

[lunchbox88]

If I want to have a "Print" button on my page, but don't want it to show on the printed page, is that possible?

 

[shatch]

THe best thing to do is to make the button open a copy of the existing page in a new window formatted for print (pass accross print=1 in querystring) Then in your code see if print=1, if so then hide anything you dont need.

 

[link9]

I disagree. Personally, I like to use the @media print stuff w/ CSS:

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

Then, just assign the noprint class to the button, and when the page is printed, it won't print.

You can even define the same class in the context of the @media screen and it will display differently on screen.

ex}
@media print
{
.noprint
{
display : none;
}
}
@media screen
{
.noprint
{
display : block;
}
}

or even:

@media print
{
.myButton
{
display : none;
}
}
@media screen
{
.myButton
{
width: 100px;
}
}

and so on.

-p

The answer to getting answered -- faq855-2992

 

[lunchbox88]

I'm not familiar with that. How do you implement that?

 

[Webwzrd]

You know....there is such a thing as over kill!

Her is how I did it:

First I added the following JavaScript to my page:

<script language="javascript">
<!--
function PrintMe()
	{
		document.Form1.btnSave.style.visibility = "hidden";
    	window.print();
    	
	}
//-->
</script>

Then I added this to the pageLoad section:

'TURN ON THE PRINTING SCRIPT !
        btnSave.Attributes.Add("onClick", "PrintMe()")

This way the button is hidden when the page prints. Then as the page compleates its postback, the button is un-hidden.

Hope this helps!
Web Wizard

 

[LV]

<script language=javascript>
function window.onbeforeprint(){
  // hide element(s)
  document.getElementById("myButton").style.display = "none";
}

function window.onafterprint(){
  // show element(s) after printing is done
  document.getElementById("myButton").style.display = "block";
}
</script>