How to print a image file in printer
I write a simple program to print a image in JSF....
I have one image (sampleImage.png).. Already i connected my pc to printer....
Manually i open the image and select print option , then i got image from printer....
Now i want print image using javascript....
File name : imagePrint.jsp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Printer</title>
<script type="text/javascript开发者_开发问答">
function printImage()
{
// Here i want write a script for print image
}
</script>
<body>
<h:form id="fileViewerForm">
<rich:panel>
<f:facet name="header">
<h:outputText value="Printer"/>
</f:facet>
<h:commandButton value="PrintImage" onclick="printImage();"/>
<rich:panel id="imageViewerPanel">
<h:graphicImage id="imageViewer" value="sampleImage.png" url="sampleImage.png"/>
</rich:panel>
</rich:panel>
</h:form>
</body>
</html>
help me about this..
The following script for print the textarea into the printer..... So i need to print the image
function printText()
{
alert("Text Area print to printer start....");
var textElem = document.getElementById("fileViewerForm:textAreaGrid1").innerHTML;
alert("Text Area Content : " + textElem);
if(textElem.toLowerCase().indexOf("<textarea", 0) != -1)
{
textElem = document.getElementById("fileViewerForm:fileContent1").value;
var regExp = /\n/gi;
textElem = textElem.replace(regExp,'<br>');
}
popup = window.open('','popup','toolbar=no,menubar=no,width=200,height=150');
popup.document.open();
popup.document.write("<html><head></head><body onload='print()'>");
popup.document.write(textElem);
popup.document.write("</body></html>");
popup.document.close();
}
You will receive image id using both h:form and h:graphicImage tag id's
The Java script is :
function printImage()
{
var iamgeId = document.getElementById('fileViewerForm:imageViewer');
var imagObject = new Image();
imagObject = iamgeId;
var originalImage = '<img id="imageViewer" src="'+imagObject.src+'"
height="'+imagObject.height+'"
width="'+imagObject.width+'" />';
popup = window.open('','popup','toolbar=no,menubar=no,width=200,height=150');
popup.document.open();
popup.document.write("<html><head></head><body onload='print()'>");
popup.document.write(originalImage);
popup.document.write("</body></html>");
popup.document.close();
}
JSF code is :
<h:commandButton value="Print" onclick="printImage();"/><br>
<rich:panel id="imageViewerPanel">
<h:graphicImage id="imageViewer" url="sampleImage.png"
value="sampleImage.png" width="200"
height="200" />
</rich:panel>
</h:panelGrid>
It works on FireFox 3.0.18.
By,
Eswara Moorthy, NEC.
You won't be able to print using javascript, since you can't manage hardware devices from the browser and it executes there.
You could send this to the browser
window.print();
It is up to the browser to decide what to do.
To print specific portions of the page, consider a print stylesheet. Using the media attribute allows you to make a certain file print only styles.
<link rel="stylesheet" href="/assets/css/print.css" media="print" />
加载中,请稍侯......
精彩评论