1,在官网下载须要的插件与编辑器:javascript
编辑器css
浏览器插件html
domo地址java
CreateControl.js
ajax
二、须要注意的是:浏览器
锐浪Grid++Report报表插件不能运行在64位浏览器中,相关报表与打印功能将没法正常运新,请改用32位浏览器(官网给出的说明)ruby
三、根据官网给出的demo设计如下调用的流程:dom
一、须要使用的页面拼接需具体打印信息的url(包括模板名称,标题,请求具体数据url的地址)jsp
二、具体打印页面接收对应的参数数据,而后显示对应的打印页面编辑器
四、具体代码
页面调用js:
好比(http://localhost:8080/test/PrintReport.jsp?title=%E6%89%93%E5%8D%B0%E8%8D%89%E5%8D%95
&report=TsCD8.grf&data=http%3a%2f%2flocalhost%3a8080%2ftest%2fservlet%2fGetData%3fid%3d100)
/* *将须要打印数据地址拼接,并跳转到对应打印页面 *Title:打印页面标题 *ReportURL:报表模板名称 *DataURL:ajax返回具体数据地址 */ var printFunction = function (Title, ReportURL, DataURL) { //具体须要跳转的地址 var printURL = "http://localhost:8080/test/" + "PrintReport.jsp?title=" + encodeURIComponent(Title) + "&report=" + encodeURIComponent(ReportURL) + "&data=" + encodeURIComponent(DataURL); //再新窗口打开这个打印页面 window.open(printURL, '_blank'); }
打印页面:PrintReport.jsp
<%@ page contentType="text/html; charset=utf-8"%> <%@ page import="java.net.URLDecoder"%> <html> <head> <title>报表打印 - <%=URLDecoder.decode(request.getParameter("title"), "UTF-8")%></title> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <script src="js/CreateControl.js" type="text/javascript"></script> <style type="text/css"> html,body { margin:0; height:100%; } </style> </head> <body style="margin:0"> <script type="text/javascript"> var Report = "<%=request.getParameter("report")%>"; if (Report == "null") Report = ""; else if (Report != "") Report = "grf/" + Report;//具体放置模板文件的地址 var Data = "<%=request.getParameter("data")%>"; if (Data == "null") Data = ""; else if (Data != "") Data = Data; //生成打印页面 CreatePrintViewerEx("100%", "100%", Report, Data, true, ""); </script> </body> </html>
ajax返回数据格式:
五、打印页面结果:
六、总结:
一、由于使用了打印页面是跳转的新页面的形式,打印前打判断能够在调用js跳转方法前实现。
二、具体打印页面也能够不使用jsp来实现,能够使用html页面来实现,而后使用js来获取对应传过来的url参数也是可行的
三、具体返回打ajax格式须要根据模板设计的不一样来格式会有所改变
四、具体的模板绘制方法请参考官方教程