Forum Moderators: open
<table>
<div id="content">
..content..
</div>
</table>
I need to be able to print the content of the div without printing the rest of the page..
I have tried @media print in the CSS.. to do that I had to create a div that is outside the table:
<table>
<div id="content">
..content..
</div>
</table>
<div id="printcontent" style="display:none">
..content..
</div>
copy the contents of the first div to the second and the @media print hides the table and displays the div but firefox does not render the div in the print preview...
I have tried a popup window with the innerHTML contents of the "content" div.. but IE will not execute window.print() for some reason... firefox works correctly.. code:
var x = window.open('','windowName','width=500,height=400,resizable=1');
x.document.write("<HTML><BODY>");
x.document.write("<LINK href=\"/style.css\" type=text/css rel=STYLESHEET>");
x.document.write(document.getElementById("content").innerHTML);
x.document.write("</BODY></HTML>");
x.print();
In the above code.. firefox works great and IE never executes the x.print();
HELP!
Paste it into <HEAD> section of the HTML document.
<script language="JavaScript">
var gAutoPrint = true; // Flag for whether or not to automatically call the print function
function printFriendly()
{
if (document.getElementById!= null)
{
var html = '<HTML>\n<HEAD>\n';
if (document.getElementsByTagName!= null)
{
var headTags = document.getElementsByTagName("head");
if (headTags.length > 0)
html += headTags[0].innerHTML;
}
html += '\n</HE' + 'AD>\n<BODY>\n';
var printPageElem = document.getElementById("printReady");
if (printPageElem!= null)
{
html += printPageElem.innerHTML;
}
else
{
alert("Could not find the printReady section in the HTML");
return;
}
html += '\n</BO' + 'DY>\n</HT' + 'ML>';
var printWin = window.open("","printFriendly");
printWin.document.open();
printWin.document.write(html);
printWin.document.close();
if (gAutoPrint)
printWin.print();
}
else
{
alert("Sorry, the printer friendly feature works\nonly in javascript enabled browsers.");
}
}
</script>
------------------------------------------------
<div id="printFriendly">
<p>Page Content Goes Here</p>
</div>
---------------------------------------------
<form id="printMe" name="printMe">
<input type="button" name="printMe" onClick="printFriendly()" value="Print this Page">
</form>
let me know if it works
