Print Div Content Using JavaScript

Guna

Hai,

I had used 4 DIV's in my web page.

During print a particular DIV, there is a need to print value of one Text Box (Note: before print user will type something in Text Box) and I had placed some Check Box also. The check box also need to be printed with check or unchecked whatever condition.

For this purpose, I had used the following code;

"text/javascript">
function printDiv() {
var divElements = document.getElementById("<%= Panel1.ClientID %>").innerHTML;
var oldPage = document.body.innerHTML;
document.body.innerHTML = "" + divElements + "";
window.print();
document.body.innerHTML = oldPage;
}

The DIV is printing but without the value of Text Box.

Please help me to print the DIV with the value of Text Box and Check Boxes.

Thanks & Regards,

Guna

8 Replies

Know the answer? Post it — somebody with the same question will find it here.

Rajeesh Menoth10y ago
Accepted answer
Hi,

The answer is helpful.then please accept it..!!
Guna10y ago
Thanks friends,

I will try the code which you had provided and update you.

Once again thanks for your replies.

Guna
Sunil Bharath10y ago
Hi Guna,

Can you first check whether you are able to get values before printing. use alert function.
because there are browser specific handlings to get control values.
var divElements = document.getElementById("<%= Panel1.ClientID %>").innerHTML;
alert(divElements);
var divElements = document.getElementById("<%= Panel1.ClientID %>").textContent;
alert(divElements);
can you try this and check
Rajeesh Menoth10y ago
Hi,

I tested this code is working fine for me..!!
function myFunction() {
//window.print();
var panel = document.getElementById("<%=Print_View.ClientID %>");
var printWindow = window.open('','','height=800,width=800');
printWindow.document.write('Contact Info');
printWindow.document.write('');
printWindow.document.write(panel.innerHTML);
printWindow.document.write('');
printWindow.document.close();
setTimeout
(function () {
printWindow.print();
}, 500);
return false;
}

Reference :

http://www.c-sharpcorner.com/blogs/printing-html-div-tag-content-using-javascript1
Rajeesh Menoth10y ago
Hi,

Check this reference :

http://forums.asp.net/t/1261525.aspx

http://stackoverflow.com/questions/2255291/print-the-contents-of-a-div
Guna10y ago
function printDiv()
{
var originalContents = document.body.innerHTML;
var inpText = document.getElementsByTagName("input")[0].value;
var printContents = document.getElementById("<%= Panel1.ClientID %>").innerHTML;
printContents += inpText;
document.body.innerHTML = printContents;
window.print();
document.body.innerHTML = originalContents;
}

The above code is used...But the Text Box Value is not printed...Please and also guide how to print the status of Check boxes.

Thanks & Regards,
Guna10y ago
Rajeesh,

Ii need to print Text Box Values and Check Box Status ......

It is not printing........Please help me.

Thanks & Regards,

Guna
Rajeesh Menoth10y ago
Hi,
function printDiv(divName){
var originalContents = document.body.innerHTML;
var inpText = document.getElementsByTagName("input")[0].value;
var printContents = document.getElementById(divName).innerHTML;
printContents += inpText;
document.body.innerHTML = printContents;
window.print();
document.body.innerHTML = originalContents;
}
check this example :

http://www.aspsnippets.com/Articles/Print-DIV-contents-with-CSS-using-JavaScript-and-jQuery.aspx