CODEWITHSUNDEEP
javascriptjqueryhtmlprinting
gdm
gdm

Reputation: 7938

Print A Div Containing Dynamic Image

I print a div in javascript by using the following code:

 $('body').on('click','button#printreceipt',function(){
        var printWindow = window.open('', '', 'height=400,width=800');
        var divContents = $("#appendReceiptHere").html();
        printWindow.document.write(divContents);
        printWindow.print();
        printWindow.document.close();

    });

The div contains dynamically generated images, like 

<img src="/mysite/generate_test_image.php" />

The div is correctly shown and the dynamic image as well. But when I try to print the div, the image is not shown, it disappears.

Any hint?

Upvotes: 1

Views: 2707

Answers (1)

gaetanoM
gaetanoM

Reputation: 42054

Try waiting for images loading and then print.

So, instead to print in your function try to print on window onload event inside the pop up window like:

$('body').on('click','button#printreceipt',function(){
   var printWindow = window.open('', '', 'height=400,width=800');
   var divContents = $("#appendReceiptHere").html() +
                        "<script>" +
                        "window.onload = function() {" +
                        "     window.print();" +
                        "};" +
                        "<" + "/script>";
   printWindow.document.write(divContents);
   printWindow.document.close();
});

Upvotes: 3

Related Questions