1

i was trying to print dynamic div html element using printElement() function but when i got problem...my code as follows

$("#btnPrint").click(function () {
                if (ImgPath != '') {
                    sHtml = "<div id='dvPrint'><table>";
                    sHtml += "<tr><td>" + "<img src='" + ImgPath + "' border='0'/>" + "</td></tr>";
                    sHtml += "<tr><td>" + $('#lblTxt').html() + "</td></tr>";
                    sHtml += "</table></div>";
                    alert($('#dvPrint').html());
                       $("#element").printElement('#dvPrint');
                }
                else {
                    alert("Image not found for print");
                }
                return false;
            });

when i just alert alert($('#dvPrint').html()); it show nothing. then how printElement() can work. i can append my dynamic div into body....i just need to generate div and print the content inside it by jquery.......i need help. thanks

Keith Costa
  • 1,783
  • 11
  • 35
  • 68

3 Answers3

3

You just formatted html string and didn't append it to the DOM. You cant find it using $('#dvPrint'). Use $(sHtml).html() to get the formatted html.

And as a result print will be: $(sHtml).printElement();

$("#btnPrint").click(function () {
    if (ImgPath != '') {
        sHtml = "<div id='dvPrint'><table>";
        sHtml += "<tr><td>" + "<img src='" + ImgPath + "' border='0'/>" + "</td></tr>";
        sHtml += "<tr><td>" + $('#lblTxt').html() + "</td></tr>";
        sHtml += "</table></div>";
        var $dvPrint = $(sHtml);
        alert($dvPrint.html());
        $dvPrint.printElement();
    }
    else {
        alert("Image not found for print");
    }
    return false;
});
Samich
  • 29,157
  • 6
  • 68
  • 77
  • your code works fine....thanks. i need one more help. in the image tag i specify height & width like but when image is printing then actual height & width wise it not printing rather it is printing as very small compare to my given height & width. i need ur help what to do? – Keith Costa Sep 30 '11 at 10:02
  • If your images not so big, you can omit these attributes at all. Otherwise, you can preload image in `img` using jquery and then get the image size. Here is example: http://stackoverflow.com/questions/799710/get-image-width-and-height – Samich Sep 30 '11 at 10:16
1

The alert($('#dvPrint').html()); won't work until you print the sHtml like this: $('#dvPrint').html(sHtml) - this will put all the content from the sHtml to the dvPrint.

v100ev
  • 63
  • 6
  • in the image tag i specify height & width like but when image is printing then actual height & width wise it not printing rather it is printing as very small compare to my given height & width. i need ur help what to do? – Keith Costa Sep 30 '11 at 10:22
  • I really didn't understand very well. You put this: to some variable using javascript and then print it like I showed in the previous message and it print's the picture not with the given size? Have you tried escaping the quotes? f.e.: var image = ''. But may be I didn't understand the problem.. – v100ev Sep 30 '11 at 11:27
1

I prefer to create a div using dom

var newdiv = document.createElement('div');

and then using it with jQuery

$(newdiv).html("<table>.....</table>");

or with DOM's interface (.addNode()) Regards

M.

BigMike
  • 6,683
  • 1
  • 23
  • 24