Tuesday, May 3, 2016

How to Print in Zk

1. Print full page.

<button label="Print" onClick="Clients.print()" />

2. Print selected div.

Create PrintUtil  java class.


import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.util.Clients;

public class PrintUtil {

public static void print(Component comp) {
print(comp, "/MedXEMR/zk/template/template.zul", null);
}

public static void print(Component comp, String cssuri) {
print(comp, "/MedXEMR/zk/template/template.zul", cssuri);
}

public static void print(Component comp, String uri, String cssuri) {
String script = "printDiv('" + comp.getUuid() + "', '" + uri + "'";
if (cssuri != null) {
if (uri.contains("zkau") && !cssuri.startsWith("/"))
cssuri = "/" + cssuri; // absolute path if using default template.zul within jar file
script += ", '" + cssuri + "');";
} else {
script += ");";
}
Clients.evalJavaScript(script);

}
}

ZUL Code.

template.zul.

<zk xmlns:n="native">
<style src="${param.printStyle}" media="print" />
<html content="${param.printContent}" />
<div>
<div align="center">
<n:hr />
<n:b>
PROHIBITION ON REDISCLOSURE OF CONFIDENTIAL INFORMATION
</n:b>
</div>
</div>


</zk>



Javascript Code.

function printDiv(uuid, uri, cssuri) {
if (uuid && uri) {
var wgt = zk.Widget.$(uuid), body = document.body, ifr = jq('#zk_printframe');
if (!ifr[0]) {
jq(body).append('<iframe id="zk_printframe" name="zk_printframe"' + ' style="width:0;height:0;border:0;position:fixed;"' + '></iframe>');
ifr = jq('#zk_printframe');
}
// wait form submit response then call print function
// reference: http://isometriks.com/jquery-ajax-form-submission-with-iframes
ifr.unbind('load.ajaxsubmit').bind('load.ajaxsubmit', function() {
var iw = ifr[0].contentWindow || ifr[0];
iw.document.body.focus();
iw.print();
});

jq(body).append('<form id="zk_printform" action="' + uri + '" method="post" target="zk_printframe"></form>');
var form = jq('#zk_printform'), content = '<div style="width: ' + wgt.$n().offsetWidth + 'px">' + jq(wgt.$n())[0].outerHTML + '</div>';
form.append(jq('<input/>').attr({
name : 'printContent',
value : content
}));
if (cssuri) {
form.append(jq('<input/>').attr({
name : 'printStyle',
value : cssuri
}));
}
form.submit().remove();
} else {
window.print();
}
}

how to call Print in zul?

<a
class="btn btn-sm btn-default fa fa-print btn-group-btn"
onClick="com.swain..PrintUtil.print(sampleform)"
tooltiptext="Print">
Print
</a>






No comments:

Post a Comment

How ChatGPT can Benefit Coding: Your Guide to Leveraging an AI Language Model

 Introduction: Hello, coders! Welcome to this blog post on how ChatGPT, an AI language model, can benefit your coding skills and projects. A...