"If You Can Dream It, We Can Build It"
Let us help your dream come true in web and multimedia design and development to open the doors to the digital world.
Print Dynamic Pages Using JavaScripts
Print specific part of the web page become very handy when you want to keep the layout of the website in the printer friendly web page as well. For example you might not want to remove the navigation. This technique can be useful to print Dynamic web pages.
First you have to select the area you want to print. Mark the selected area using “<div>” html tag. Do not forget to specify the DIV tag as well using id attribute.
Code Example:
<div id="divPrint">
<table width="595" class="style4">
<tr><td class="style4">
<h1> My Dynamic Content </h1>
<asp:PlaceHolder id="PlaceHolder" runat="server"/>
</td></tr>
</table>
</div>
Tips:
1.
Do not forget to specify the width of the print area to 595 as it is the best width for A4 size paper.
2. You are free to use any CSS as you can change it when it sends to the printer. However, it is safe and clear to use the same CSS as reader can have clear idea about how it will looks like when it print.
Now we should get the help of JavaScript to do the printing.
Code Example:
<script language="javascript">
function CallPrint(strid)
{
var prtContent = document.getElementById(strid);
var WinPrint = window.open('','','letf=10,top=10,width="450",height="250",toolbar=1,scrollbars=1,status=0');
WinPrint.document.write("<html><head><LINK rel=\"stylesheet\" type\"text/css\" href=\"css/print.css\" media=\"print\"><LINK rel=\"stylesheet\" type\"text/css\" href=\"css/print.css\" media=\"screen\"></head><body>");
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.write("</body></html>");
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
WinPrint.close();
}
</script>
Click here for full sample code : javasript print example
Previous: Simple JavaScript Print
Please use any of this content to improve your web and if you have any questions please feel free to contact microsector.net
|