How can I print only one specific panel ID

Question

I have an aspx page (c# using visual studio 2010) in which I have a terms of service. I would like to allow the users to print the terms of service without having to print the rest of the page. (The rest of the page is various other information)

Therefore I would like a way to specify a panel ID and when the "Print TOS" button is pushed it will only print the information which is in the specific panel specified.

Thanks in advance.

Answer 1

Hi @bvandrunen, why not open a popup window with JUST that content and print it? This is the way it's usually done.

Basically, create another page with just that Panel, add a print() method on page load, and open that page from the main T&C's page in a popup window.

Alternatively, I've used a jQuery plugin which does exactly what I've described above, but it allows you to specify a <div> that you want to print.

See it in action here.

Answer 2

you need a print stylesheet-

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

in that stylesheet, hide things you dont want printed- you can even resize the things you want printed to fit the page better.

Answer 3

OK ... couple of things to try.

1) Use some javascript to reference the panel, extract the contents (.innerHTML) when the user clicks print, then dynamically create a new window (window.open()), inject the HTML into the body and fire window.print() on the new window. I've done that before tho not sure how well it stands up today with browser behaviours ...

2) With probably a lot of effort, introduce a print specific css file that hides every other part of your page (e.g. div.nav { display: none } ) and then allows just your panel to be printed

Answer 4

I gave points to @Marko and @Chris because I found a solution that was similar to their ideas. I found my answer here:

http://www.eggheadcafe.com/community/aspnet/3/10034702/how-to-print-part-of-web-page.aspx

(4th solution down by Sagar P)

I am answering this way because the javascript and way of working with my worked perfect from this link. The way it works is it pops out a new window and puts the html of the panel into the new open window.

Answer 5

You can use the jqPrint plugin that permit to print only the content of a single DIV of your page.