Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hello,
How to print the report when the print button is clicked will appear printer dialog and print the report?
I have made it like this,
- retrieve the data in the database table
- return object Amedia
- set it to an iframe
- then display using JavaScript
but the printed result is the print screen display
here's a snippet of my code
file CS.zul
<?xml version="1.0" encoding="UTF-8"?>
<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" root="./winCS" ?>
<?variable-resolver class="org.zkoss.zkplus.spring.DelegatingVariableResolver"?>
<?meta content="text/html; charset=UTF-8" pageEncoding="UTF-8" ?>
<?meta content="text/html;charset=utf-8" http-equiv="Content-Type"?>
<?link rel="stylesheet" type="text/css" href="/style.css"?>
<?link rel="stylesheet" type="text/css" href="/print.css"?>
<zk xmlns="http://www.zkoss.org/2005/zul"
xmlns:h="http://www.w3.org/1999/xhtml"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.zkoss.org/2005/zul
http://www.zkoss.org/2005/zul/zul.xsd"
xmlns:w="http://www.zkoss.org/2005/zk/client">
<window id="winCS" hflex="1" vflex="1" border="normal" sizable="true"
maximizable="true"
apply="${CSController}>
<iframe id="iframePrintJS"/>
<button id="printStructByJS" label="Print Struct BY JS"/>
</window></zk>
file CSController.java
@org.springframework.stereotype.Component("CSController")
@Scope("prototype")
public class CashSalesController extends GenericForwardComposer{
@Autowired private CashSalesService cashSalesService;
private Iframe iframePrintJS;
@Override
public void doAfterCompose(Component comp) throws Exception {
super.doAfterCompose(comp);
}
public void onClick$printStructByJS(){
AMedia amedia=null;
amedia=cashSalesService.printStructByJS(txtNo.getValue());
iframePrintJS.setContent(amedia);
iframePrintJS.setWidth("500px");
iframePrintJS.setHeight("500px");
Clients.evalJavaScript("document.getElementById('"+iframePrintJS.getContent()+"');window.focus();window.print();window.close()");
}
}
thank you all for your help
This is an example of a printed print screen
This document should be printed
looks like the iframe component has a ZK that can't be read by window.print ()
because if I test successful with pure html, here is the code that I tried
<html><![CDATA[
<iframe src="struct.pdf" id="myFrame" frameborder="0" style="border:0;" width="300" height="300"> </iframe>
<p>
<input type="button" id="bt" onclick="printOkIframe()" value="Print PDF myFrame" />
</p>
]]></html>
<script type="text/javascript">
function printOkIframe() {
var objFra = document.getElementById('myFrame');
objFra.contentWindow.focus();
objFra.contentWindow.print();
}
</script>
but the problem is how to do it so that myFrame.src can be set its value using a .pdf file dynamically.
so that the process for printing it I will change like this,
user click print and will generate a .pdf file.
String pathAndFilePdf = cashSalesService.printStructByJS (txtNo.getValue ());
then the path will be set in
myFrame.src = pathAndFilePdf;
thanks
I've tested out the standard iframe printing with a ZK iframe triggered in javascript using window.frame, and it works on my side. See example on fiddle here: https://zkfiddle.org/sample/1cs39d7/8-iframe-print
There's a lot of data in your previous posts, so I'm getting confused regarding what the current blocking point is :D
Does this work on your side? :)
hello Duchemin, the code that you gave I managed to use. but there is a problem, namely when I click the 'printStructByJS' button
window does not display a print dialog, then when I made another button to display the print dialog was successful,
looks like code i used
window.frames["IframePrintJS"].focus();
window.frames["IframePrintJS"].print();
executed first before the iframe content rendering process is complete. then I try to check whether the iframe has finished loading like this
function doPrintIframe () {
var iframe = window.frames ["IframePrintJS"];
iframe.onload = () => {
window.frames ["IframePrintJS"].focus();
window.frames ["IframePrintJS"].print();
}
}
but without success, the print dialog does not appear.
Thanks
hello all, it looks like I've been successful about the problem, here is the code that I use
function doPrintIframe(){
WaitForIFrame();
}
function WaitForIFrame() {
var iframe= window.frames["IframePrintJS"];
if(iframe.readyState != "complete"){
setTimeout("doPrintIframe2();", 200);
}
else{
window.frames["IframePrintJS"].focus();
window.frames["IframePrintJS"].print();
}
}
function doPrintIframe2(){
window.frames["IframePrintJS"].focus();
window.frames["IframePrintJS"].print();
}
thank you very much for all your help
Asked: 2020-09-25 11:56:01 +0800
Seen: 13 times
Last updated: Sep 29 '20