I am trying to print an ASP.NET Image using the example here.
When I use the above example for a div, it works, but I can't adapt it to print anything else. How can I get it to print an Image? Do I wrap the Image in a div and change the ".text()" part in the script to something else?
Because you're passing a wrong parameter to the printing function. Printing something in JavaScript is as easy as calling window.print(); method. To test it, simply use developer tools of your browser and write into its console:
window.print();
Now, when you want to print something specific, you have two ways:
Now, what you can do is to write your own function:
function printImage(image)
{
var printWindow = window.open('', 'Print Window','height=400,width=600');
printWindow.document.write('<html><head><title>Print Window</title>');
printWindow.document.write('</head><body ><img src=\'');
printWindow.document.write(image.src);
printWindow.document.write('\' /></body></html>');
printWindow.document.close();
printWindow.print();
}
var image = document.getElementById('image');
printImage(image);
and you can also see this function in action here.
Just let the browser open popup, and also note that I only pass the src value of the image element to the new window.
printWindow.close() as the last line to automatically close the window after printing.Yes.
The following java script will help you to print an image in image control.
var printContent = document.getElementById('divImage');
var img = document.getElementById('imgMain');
var windowUrl = 'MyPage.aspx';
var uniqueName = new Date();
var windowName = "MyPage" + uniqueName.getTime();
printWindow = window.open(windowUrl, windowName, 'location=1,status=1,scrollbars=1,width=800,height=600');
printWindow.document.write("<div style='width:100%;'>");
printWindow.document.write("<img id='img' src='" + img.src + "'/>");
printWindow.document.write("</div>");
printWindow.document.close();
printWindow.focus();
printWindow.print();
printWindow.close();
return false;
this is better solution that also work fine in google chrome:
var printWindow = window.open('', 'Print Window', 'height=533,width=800');
printWindow.document.write('<html><head><title>Print Window</title>');
printWindow.document.write("<script src='script/jquery-1.11.3.min.js' type='text/javascript'><\/script>");
printWindow.document.write("<script type='text/javascript'>");
printWindow.document.write("var DoPrint = false;");
printWindow.document.write("$(document).ready(function () {");
printWindow.document.write("DoPrint = true;");
printWindow.document.write("});");
printWindow.document.write("<\/script>");
printWindow.document.write('</head><body ><img src=\'');
printWindow.document.write(document.getElementById('image').src);
printWindow.document.write('\' /></body></html>');
printWindow.document.close();
function Print() {
if (typeof printWindow.DoPrint != "undefined" && printWindow.DoPrint == true) {
clearInterval(PrintintervalNumber);
printWindow.print();
printWindow.close();
}
}
PrintintervalNumber = setInterval(Print, 1000);
Yep, instead of using .text(), you use .html() where you pass the <img /> (including the source of course) to the fake document ready for print.
Why not just make it this simple?
<input type="button" value="Print Div" onclick="PrintElem('<img src=myimage.jpg>')" />
and then call Popup like this: Popup(elem);
(you don't really need this Popup() function if you pass an image to print like this)
