window.print() show blank page (no content at all)

Question

i want to print the whole webpage (html including css) im using window.print() on button onClick. when click the button it shows the print preview but doesnt show any content. the page was blank on print preview. By the way i am using chrome version 73.0.3683.86

I already try javascript function but didnt work at all.not even print preview.

<input type="button" class="btn btn-primary" onClick="window.print()" value="print"/>

Could you create a js fiddle maybe, so that we can try it out? — xadhix, Apr 02 '19 at 04:13
The code snippet you included works fine for me. If i click the button I see a print preview that includes the button. I`m on chrome 73.0.3683.86 too. — Azer, Apr 02 '19 at 04:15
@Azer yea its should be okay with that code. erm,so do you know any potential mistake are cause blank page? — Alia Azmee, Apr 02 '19 at 04:20
Possible duplicate of [Print
only?](https://stackoverflow.com/questions/468881/print-div-id-printarea-div-only) — misterhtmlcss, Apr 02 '19 at 04:25
@AliaAzmee It's difficult to say since the code snippet itself is not broken. Perhaps you have some broswer extensions that are getting in the way? I believe chrome's 'incognito mode' runs without any extensions activated. So perhaps you could try running the code in 'incognito mode' and see if it works. If it does, then it's likely that some extension is causing the issues. — Azer, Apr 02 '19 at 04:32

score 0 · Answer 1 · answered Apr 02 '19 at 04:22

0

you spelt "onclick" as "onClick", there is no need for the camelCase. Try the code below

<input type="button" class="btn btn-primary" onclick="window.print()" value="print"/>

answered Apr 02 '19 at 04:22

Duncan Leung

142
1
11

1

my button onClick just work fine actually , the problem is print preview shows blank page. i already try the onclick before but same problem – Alia Azmee Apr 02 '19 at 04:26
1

did your page load fully yet? the page has to load completely before printing – Duncan Leung Apr 02 '19 at 04:30

score 0 · Answer 2 · answered Sep 22 '21 at 12:12

I've tries various solutions, only this helped me:

HTML:

<a onclick="printPage();return false;" href="#">Print details</a>

JS:

<script>
    function printPage(){
        var printHtml = window.open('', 'PRINT', '');
        printHtml.document.write('<html><head>');
        printHtml.document.write(document.getElementById("printme").innerHTML);
        printHtml.document.write('</body></html>');
        printHtml.document.close(); 
        printHtml.focus();
        printHtml.print();
        printHtml.close();
        return true;
  }

window.print() show blank page (no content at all)

2 Answers2