Makes window.print wait until the window is load

Question

I need to print a page created dinamically with JavaScript and Html. My problem is that sometimes it shows a blank page. I think that it is because the "window" isn't loaded yet. How can printing wait until the window is loaded?

I tried to add the method wait() but the problem is the same. This is the method for printing page:

function printpage(){ 
    var panel;

    panel =document.getElementById("cajaticket").innerHTML;
    var mywindow = window.open('', 'Print');
    mywindow.document.write('<html><head><link rel="stylesheet" href="css/extras/ticket.css"></head><body>');
    mywindow.document.write(panel);
    mywindow.document.write('</body></html>');
    mywindow.document.close();
    mywindow.focus();
    mywindow.print();
    mywindow.close();
    panel=null;
}

It should always print the window,but currently, it only works sometimes.

Possible duplicate of [Detecting the onload event of a window opened with window.open](https://stackoverflow.com/questions/3030859/detecting-the-onload-event-of-a-window-opened-with-window-open) — Ivar, Jul 28 '19 at 10:11
Hi @Ivar. Duplicate? Do you refer that I could have the same page open two times? — Abraham, Jul 28 '19 at 10:14
No, I mean that the question you ask here likely already is answered in the link I posted. — Ivar, Jul 28 '19 at 10:19
ahh sorry. Thanks @Ivar :) But this is for a PopUp,no? Is the same? — Abraham, Jul 28 '19 at 10:20
Both your and their question are about the `window.open`. I'd say give it a try. Specifically [this answer](https://stackoverflow.com/a/3030893/479156). — Ivar, Jul 28 '19 at 10:30
I will try, If it solve my problem I will delete it post like a duplicate. thanks @Ivar :) — Abraham, Jul 28 '19 at 10:32

Udo E. · Accepted Answer · 2019-07-28T18:09:33.497

1

If you need jQuery to help you with this, try this:

$($(window).on('load', function() {
        printpage();
    });
);
function printpage(){ 
    var panel;

    panel =document.getElementById("cajaticket").innerHTML;
    var mywindow = window.open('', 'Print');
    mywindow.document.write('<html><head><link rel="stylesheet" href="css/extras/ticket.css"></head><body>');
    mywindow.document.write(panel);
    mywindow.document.write('</body></html>');
    mywindow.focus();
    mywindow.print();
    mywindow.close();
    panel=null;
}

This will ensure that the DOM is loaded, ready and rendered before printing.

UPDATE: Using

$(mywindow).on('load', function() { 
    // manipulate mywindow here
});

would have been great but the documentation doesn't say explicitly that this is supported:

The load event is sent to an element when it and all sub-elements have been completely loaded. This event can be sent to any element associated with a URL: images, scripts, frames, iframes, and the window object.

see the complete documentation here.

edited Jul 28 '19 at 18:09

answered Jul 28 '19 at 11:03

Udo E.

2,665
2
21
33

Thanks @Udo E! But this is called when "window" is load,no? I need to execute the "print", when "mywindow" is load. And this is created inside the method that you call. – Abraham Jul 28 '19 at 11:21
@Abraham, see my update. use it and see if it works. – Udo E. Jul 28 '19 at 12:27
Hi Udo! It works. It generates the new window with the correct content, but always generate a infinite loop and dont print. What am I doing wrong? Sorry for ask too much, but I really dont know why it happens. – Abraham Jul 28 '19 at 13:04
Hi again! It works, I deleted for an error mywindow.document.close(); for this I recieved a loop. – Abraham Jul 28 '19 at 16:41
@Abraham, glad to know it works. Are you using `$(mywindow).onload();`? If you are, put only code accessing `mywindow` inside this handler. Yes, I see you have `mywindow.document.close()` and `mywindow.close()`. I didn't notice that earlier. I have updated the answer. Hope the problem is resolved now. – Udo E. Jul 28 '19 at 18:08

Masud Rana · Answer 2 · 2019-07-28T10:07:58.533

0

You can call printpage() function if the entire page has loaded.

$(window).bind("load", function() { // code here });

edited Jul 28 '19 at 10:07

answered Jul 28 '19 at 09:47

Masud Rana

103
12

It seems he is not using jQuery – Emanuele Scarabattoli Jul 28 '19 at 10:08
Dont care about it, I'm starting to using jquery in class, I can try it. @Masud if is use: ```$(mywindow).bind("load", function() { mywindow.print() }); ``` it should work? – Abraham Jul 28 '19 at 10:13
@Masud I tried this code and this always generate the page in a new link. But mywindow.print() dont work. I refer, that this dont generate the PDF and loop loading – Abraham Jul 28 '19 at 10:31
@Abraham you can try this one `window.onload = function() { mywindow.print(); }` – Masud Rana Jul 28 '19 at 11:41
Hi @Masud ! shouldn't I add mywindow.close? – Abraham Jul 28 '19 at 12:07
I tried it , and generates correctly the page. But dont shows the option to print it. This only show the generated page, and generate an infinite loop. What am I doing wrong? :) – Abraham Jul 28 '19 at 12:10

Makes window.print wait until the window is load

2 Answers2