-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hi, I'd like to create a Print button that will print out a data table to the printer. Since the table has quite a few columns, is there a way to auto configure the page layout to "Landscape" instead of "Portrait"; and then auto-shrink the font size to prevent those right-most columns from "spilling" over to the next page? I'm using ZK 5.0.3 Community Edition and IE7 browser. Any insight is greatly appreciated. Thanks...
Ex:
<!-- ==== My Data Grid ==== --> <grid id='myGrid1'> <columns sizable="true"> <column label="Type" sort="auto"/> <column label="Content"/> .... (~15 - 20 columns) </columns> <rows> <row> .... </row> </grid> <!-- ==== My Print Button ==== --> <button id='printMyGrid1' label='Print Table' onClick='....' />
@zknewbie1
you can use javascript to ask browser to print a certain page.
But I'm wondering if javascript support so sophisticate manipulation like landscape.
The function maybe provided by printer driver.
One usual way to print,
is render the content in a new browser tab.
I think a better way to do this is to show your result in a PDF rather than an HTML.
this can gives you layout consistency, modern browser's evolution has no effort put on printing, no telling the "standard of print" that browser should follow.
zknewbie1,
I'd recommend starting with iReport. You can see more information and download it from http://jasperforge.org/projects/ireport. You might also begin with the Quick Start Tutorial.
Assuming you already have a database that contains the data from which you want to generate reports, use iReport's design tools to create some simple reports. Once complete, simply copy the compiled .jasper files to the server where you run ZK. Be sure they are in a location that is in your classpath. For example, you could copy them into your ../WEB-INF/classes folder (although this probably isn't the most appropriate location).
Next, you can write a ZUL page to display the report. The following example will give you a head start:
<window width="100%" height="100%"> <borderlayout height="100%"> <north maxsize="24" size="24" border="0"> <panel> <panelchildren> <div align="center" style="padding-top: 15px;"> <cell align="right"><label style="font-weight: bold; color: #003E7E;" value="Report: "/></cell> <listbox id="chosenReport" mold="select" > <listitem label="-- Please Select --" selected="true" /> <listitem label="Assets by Assignment" value="Assets by Assignment.jasper"/> <listitem label="Assets by Owner" value="Assets by Owner.jasper"/> <listitem label="Assets by Department" value="Assets by Department.jasper" /> <listitem label="Pending Services" value="Pending Services.jasper" /> </listbox> </div> <div align="center" style="padding-top: 15px;"> <button label="Generate Report"> <attribute name="onClick"> if (chosenReport.getSelectedItemApi().label.equals("-- Please Select --")) { Messagebox.show("Please Choose A Report", "Error", Messagebox.OK, Messagebox.ERROR); } else { doReport(chosenReport.getSelectedItemApi().value); } </attribute> </button> <space spacing="15px" orient="horizontal" /> </div> </panelchildren> </panel> </north> <center border="none" flex="true"> <iframe id="report" /> </center> </borderlayout> <zscript> import java.io.*; import java.sql.*; import org.zkoss.util.media.AMedia; import net.sf.jasperreports.engine.JasperRunManager; void doReport(reportName) { InputStream is = null; try { //generate report pdf stream is = Thread.currentThread().getContextClassLoader().getResourceAsStream(reportName); final byte[] buf = JasperRunManager.runReportToPdf(is, params, getConnection()); //prepare the AMedia for iframe final InputStream mediais = new ByteArrayInputStream(buf); final AMedia amedia = new AMedia("MyReport.pdf", "pdf", "application/pdf", mediais); //set iframe content report.setContent(amedia); } catch (Exception ex) { throw new RuntimeException(ex); } finally { if (is != null) { is.close(); } } } private static Connection getConnection() throws ClassNotFoundException, SQLException { static Connection connection; Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver"); connection = DriverManager.getConnection("jdbc:sqlserver://999.99.99.9;user=dbuser;password=dbpassword"); } </zscript> </window>
The only other thing you have to do is modify the connection string to match your database. We use SQL Server so that is what I've included here.
I think you'll find it very easy to generate PDF reports from Jasper in ZK.
Hope that helps,
Todd
Asked: 2010-07-27 21:59:52 +0800
Seen: 910 times
Last updated: Aug 11 '10