views:

1401

answers:

3

I have a php page which has a chart, a date picker(calendar) and a few buttons.

I want to add another button "Print Chart" which ONLY prints the chart & not the entire page ,in a local printer.

I am trying to do this by a having another script(which only outputs a chart) and using the javascript function 'window.print'

html

<input type="button" onClick="printChart()"   value="Print Chart">

javascript

function printChart(){

    var myParameters = window.location.search;// Get the parameters from the current page

    var URL = "http://my_server/my_folder/my_script_that_outputs_only_my_chart.php"+myParameters;

    var W = window.open(URL);

    W.window.print(); // Is this the right syntax ? This prints a blank page and not the above URL
}

I tried the above code - it doesnt work. A blank page gets printed.

Is there a way to print a target URL ? If yes, is it possible to print it without having to open a new window ?

Thanks for your time

A: 

Try using CSS @media print

"I want to add another button "Print Chart" which ONLY prints the chart & not the entire page ,in a local printer. "

Just try javascript print, and then create a css class like

`@media print` {
.onprinthide { dispaly: none; }
}

and apply to all of those elements which are not required for printing.

Wbdvlpr
+2  A: 

You could use a print stylesheet:


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

In additional to your normal style sheet. In print.css, just make everything "display: none;" except what you want to print.

mgroves
Thanks!. Added a div tag in my html and included the sections that I don't want to print. In my print.css, made that div " display: none" - worked great
cvic
+1  A: 

Try removing the W.window.print() call and adding a

<body onload="window.print();">
...
</body>

to your php document to make sure your document is ready before it prints, and just have that page print itself.

As for printing from that page by itself, adding a

  <input type="button" value="Print" onclick="window.print();" />

should work.

Tony Heupel