On button click, I'm using window.print() of javascript for printing print_div contents,
But because of some security issue, i wanted to avoid the multiple printing (like using Cntrl + P) options, So i was thinking of to clear print_div contents, that users can't re-print again and again.
Rough Code here,
document.getElementById("print_div").innerHTML = //Some contents to be printed on paper.
window.print()
document.getElementById("print_div").innerHTML = '' // Clearing old contents to avoid mis-use
But this code not working at all, its clearing print_div contents before creating print preview like in chrome.(i guessed, working Asynchronously)
Could any one tell me, where am doing wrong here?
Note: Am using Chrome: 22.0.1229.92 m to test my code & i want to go for chrome only.
On button click, I'm using window.print() of javascript for printing print_div contents,
But because of some security issue, i wanted to avoid the multiple printing (like using Cntrl + P) options, So i was thinking of to clear print_div contents, that users can't re-print again and again.
Rough Code here,
document.getElementById("print_div").innerHTML = //Some contents to be printed on paper.
window.print()
document.getElementById("print_div").innerHTML = '' // Clearing old contents to avoid mis-use
But this code not working at all, its clearing print_div contents before creating print preview like in chrome.(i guessed, working Asynchronously)
Could any one tell me, where am doing wrong here?
Note: Am using Chrome: 22.0.1229.92 m to test my code & i want to go for chrome only.
-
If I open devtools on this very page and type:
document.getElementById("content").innerHTML = "Test"; window.print(); document.getElementById("content").innerHTML = '';everything will work as expected. I'll get the preview with "Test" and when I close the print dialog#contentdiv will be empty.window.print()doesn't seem to be asynchronous . – Konrad Dzwinel Commented Oct 10, 2012 at 7:27 - Yeh..its working fine at devtools but not in actual code. BTW am trying to clear this by using setTimeOut Its weird but working for me.. :) – Niks Jain Commented Oct 10, 2012 at 7:31
6 Answers
Reset to default 3It's because print window wasn't loaded.
var showPrintWindow = function (context) {
var printWindow = window.open('', '');
var doc = printWindow.document;
doc.write("<html><head>");
doc.write("<link href='/css/printReport.css' rel='stylesheet' type='text/css' media='print' />");
doc.write("</head><body>");
doc.write(context);
doc.write("</body></html>");
doc.close();
function show() {
if (doc.readyState === "plete") {
printWindow.focus();
printWindow.print();
printWindow.close();
} else {
setTimeout(show, 100);
}
};
show();
};
You can use setTimeout method and try it.
setTimeout("your code or function etc",mili seconds)
setTimeout("document.getElementById('print_div').innerHTML = ''",5000);
You are printing in the print_div and in next step you are clearing the same. Therefore it shows empty. You can store printing data in a variable. Then display it in the print_div and you can clear the variable.
var print = "";
print += "<p>Something </p><br/>";
print += "<table><tr><td>Something</td><td>Something</td></tr>
<tr><td>Something</td><td>Something</td></tr> </table>";
document.getElementById("print_div").innerHTML = print;
print = "";
something like this. Set this javascript to button onsubmit event.
Had a similar problem to yours in Chrome, it was showing blank page in Print Preview. Tried using setTimeout but it didn't work. What worked was window.onload.
<div id="printableArea">
<h1>Print me</h1>
</div>
<input type="button" onclick="printDiv('printableArea')" value="print a div!" />
javascript:
function printDiv(divName) {
var printContents = document.getElementById(divName).innerHTML;
w = window.open();
w.document.write(printContents);
w.document.write('<scr' + 'ipt type="text/javascript">' + 'window.onload = function() { window.print(); window.close(); };' + '</sc' + 'ript>');
w.document.close(); // necessary for IE >= 10
w.focus(); // necessary for IE >= 10
return true;
}
I would not go for the setTimeout, it will only work if the user immediately firms the print, which you cannot assume blindly..
I would do something like the following:
var html = "<html><head></head><body>" + $("print_div").html() + "</body></html>";
var newWindow= window.open("", "PrintWindow",
"width=100,height=50,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes");
newWindow.document.writeln(html);
newWindow.document.close();
newWindow.focus();
newWindow.print();
newWindow.close();
and then perform your wipe
$('print_div').clear();
setTimeout(function(){printWindow.document.close();
printWindow.print();}, 500);
it will work