码迷,mamicode.com
首页 > Web开发 > 详细

调用MyReport实现js直接打印

时间:2015-02-05 13:40:20      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:javascript   flex   myreport   打印   web   



生成MyReport打印控件

打开Flash Builder添加一个应用,命名为MyReportPrintApp

技术分享

封装myreport的打印方法让外部js能够访问,MyReportPrintApp.mxml代码如下:

 

<?xmlversion="1.0" encoding="utf-8"?>

<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"

                           xmlns:myreport="myreport.*"

                           minWidth="800"minHeight="600" backgroundColor="0xffffff"creationComplete="Init()"

                           fontFamily="Simsun"layout="horizontal" paddingBottom="0"paddingLeft="0"

                           paddingRight="0"paddingTop="0">

       <!--

      

       该文件把MyReport打印功能打包成独立的swf应用,通过jshtml页面交互调用。

      

       -->

       <mx:Stylesource="Index.css"/>

      

       <mx:Script>

              <![CDATA[

                     importmx.collections.ArrayCollection;

                    

                     importmyreport.MyReportEvent;

                     importmyreport.ReportEngine;

 

                     private function Init():void

                     {

                           //注册打印事件

                           ReportEngine.AddEventListener(myreport.MyReportEvent.PRINT,OnPrint);

                           AddExtInterface();

                           OnMyReportInitialized();

                     }

               

                     private functionOnPrint(event:MyReportEvent):void

                     {

                           //处理打印事件

                           OnMyReportPrinted();

                     }

               

                     private functionAddExtInterface():void

                     {

                           if(ExternalInterface.available)

                           {

                                  ExternalInterface.addCallback("loadAndPrint",LoadAndPrint);

                           }

                     }

                     //==============定义外部访问接口====================

                     /**

                      * 加载完成时调用,通知外部初始化加载已完成

                      * (主动调用)

                      */

                     private functionOnMyReportInitialized():Object

                     {

                           if(!ExternalInterface.available)

                                  return 0;

                           returnExternalInterface.call("onMyReportInitialized");

                     }

        

                     /**

                      * 打印时调用,通知外部执行了打印功能

                      * (主动调用)

                      */

                     private function OnMyReportPrinted():Object

                     {

                           if(!ExternalInterface.available)

                                  return 0;

                           returnExternalInterface.call("onMyReportPrinted");

                     }

                     /**

                      * 加载报表和数据并且打印

                      * (被动调用,必须在onMyReportInitialized执行后调用)

                      */

                     private functionLoadAndPrint(url:String, params:Object, table:Array):void

                     {

                           ReportEngine.LoadAndPrint(url,newArrayCollection(table), params);

                     }

              ]]>

       </mx:Script>

 

</mx:Application>

 

编译生成MyReportPrintApp.swf,拷贝出来使用。

技术分享

 

调用MyReport打印控件

MyReportPrintApp.swf嵌入到html页面,编写js调用myreport,实现直接打印。

html/js代码如下:

 

<!DOCTYPE htmlPUBLIC "-//W3C//DTDXHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>jsflash交互:js直接打印</title>

    <script type="text/javascript" src="swfobject.js"></script>

    <script src="jquery-1.9.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        //一下脚本用于动态创建swf节点

        var swfVersionStr = "11.1.0";

        var xiSwfUrlStr = "playerProductInstall.swf";

        var flashvars = {};

        var params = {};

       params.quality = "high";

        //params.bgcolor = "#ffffff";//去掉背景色

       params.allowscriptaccess = "sameDomain";

       params.allowScriptAccess = "always";

        params.allowfullscreen= "true";

        var attributes = {};

       attributes.id = "MyReportPrintApp";

       attributes.name = "MyReportPrintApp";

       attributes.align = "middle";

       swfobject.embedSWF("MyReportPrintApp.swf","flashContent", "10px", "10px",swfVersionStr, xiSwfUrlStr, flashvars, params, attributes);

    </script>

    <script type="text/javascript">

       $(document).ready(function () {

           onPageLoad();

        });

 

        var myReportAPI; //定义MyReport接口对象

        var myReportInit = false;//定义MyReport初始化变量

 

        //页面加载完成时调用

        function onPageLoad() {

           myReportAPI = document.getElementById("MyReportPrintApp");

 

        }

 

        //自定义打印方法1

        function loadAndPrint1(){

           var url = "xml/ReportStyle1.xml";//报表模板请求地址

 

           //报表参数数据,这里为了测试方便使用了静态的数据,实际使用时应该向服务端动态请求数据。

           var params = {};

           params["单据编号"] = "KA06417033944";

           params["单据日期"] = newDate();

           params["主标题"] = "销售单";

           params["公司名称"] = "XXXX贸易公司";

           params["经手人"] = "某某某";

           params["公司地址"] = "广州市天河区天河路xx xx大厦 xx";

           params["公司电话"] = "66866888";

           params["公司"] = { "地址": "广州市天河区天河路xx xx大厦 xx", "电话": "66866888"};

 

           //报表表格数据,这里为了测试方便使用了静态的数据,实际使用时应该向服务端动态请求数据。

           var table = newArray();

           for (vari = 0; i < 25; i++) {

               table.push({ ID: i, 名称: "商品信息XXX 规格XXX 型号XXX", 数量:i + 1, 金额: (i + 1) * 10, 日期: new Date() });

           }

 

           myReportLoadAndPrint(url,params,table);

        }

 

        /**

        * 加载完成时调用,通知外部初始化加载已完成

        *(flash to js:主动调用)

        */

        function onMyReportInitialized() {

           myReportInit = true;

           //以下是自定义代码

           //alert("MyReport初始化。");

        }

 

        /**

        * 打印时调用,通知外部执行了打印功能

        *(flash to js:主动调用)

        */

        function onMyReportPrinted() {

           //以下是自定义代码

           alert("MyReport打印完成。");

        }

 

        /**

        * 加载报表和数据并且打印

        *(js to flash:被动调用,必须在onMyReportInitialized执行后调用)

        *@param url: 报表格式路径

        *@param paramList: 报表参数数据(多份数据),Array或者null

        *@param tableList: 报表表格数据(多份数据),Array或者null

        */

        function myReportLoadAndPrint(url, paramList,tableList) {

           if (!myReportAPI || !myReportInit) {

               alert("打印控件未就绪!")

               return;

           }

           myReportAPI.loadAndPrint(url, paramList, tableList);

        }

    </script>

</head>

 

<body>

<p style=" text-align:center">该示例演示在页面嵌入MyReport打印控件,使用jsflash插件进行交互,实现js直接打印</p>

 

<div style=" text-align:center"><buttontype="button"onclick="loadAndPrint1()">直接打印</button> </div>

 

<div id="flashContent" style="visibility: hidden">

 

</div>

</body>

</html>

 

浏览效果

 技术分享

技术分享

技术分享


在线效果演示

 

如何获得myreport

MyReport产品网站


相关文章

MyReort专栏

??

调用MyReport实现js直接打印

标签:javascript   flex   myreport   打印   web   

原文地址:http://blog.csdn.net/hunkcai/article/details/43526161

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!