I have created four apex tabs in a vf page. In that page,I'm using print functionality for the particular div section.Its works fine when i click the print button for the first time.But when i click the second tab page gets refreshed.How can i resolve this issues.
function printDiv(divID) {
//Get the HTML of div
var divElements = document.getElementById(divID).innerHTML;
//Get the HTML of whole page
var oldPage = document.body.innerHTML;
//Reset the page's HTML with div's HTML only
document.body.innerHTML =
"<html><head><title></title></head><body>" +
divElements + "</body>";
//Print Page
window.print();
//Restore orignal HTML
document.body.innerHTML = oldPage;
}
<input type="button" value="Print" onclick="return printDiv('printablediv');" style="width:80px; height:50;font-size: 18px; " />
<div=printDiv>
<apex:tab>
text here
</apex:tab>
<apex:tab>
text here1
</apex:tab>
</div>
CSS Code:
<style type="text/css" media="print">
@media print
{
#non-printable { display: none; }
#printable {
display: block;
width: 100%;
height: 100%;
}
}
</style>
</head>
<body>
<div id="printable" >
Your content to print
</div>
<input type="button" id="non-printable" class=normaltext onclick="JavaScript:window.print();" value="print" />