很多报表软件可以利用JS接口来实现更多更复杂的功能。以FineReport为例,开放了大量的JS API给用户,根据执行JS的主体不同可以将分为三大类:FR、FS和contentWindow。

在js语句中执行可以使用FR的方法或者属性,比如说FR.Msg.alert,FR中的方法比如引入finereport.js。FS的方法可以用于数据决策系统中的js接口,比如说FS.tabPane.addItem。而contentWindow是在web页面集成的时候,将F报表嵌入在iframe中,调用报表对象时使用的接口,比如说:document.getElementById('reportFrame').contentWindow,其中document.getElementById('reportFrame')是获取iframe对象,contentWindow是报表对象,相当于html中的window对象。

由于篇幅,这里先介绍FR

FR

大家知道,预览报表时,报表servlet会将cpt模板转为html,在这个html的head头部中会引入FR的js,如下:

<script type="text/javascript" src="/WebReport/ReportServer?op=emb&resource=finereport.js"></script>

这个finereport.js中包含了许多内置的function以及一些公有的属性,不管在模板中还是其他网页中,只要引入了finereport.js,就能够通过FR.xxx的形式调用公有的属性与方法

比如,在模板中使用,访问模板时会自动引入finereport.js,因此在模板的js脚本中可以直接使用FR.xxx来调用方法,如下图:

或者需要在自己的网页如某个jsp页面中调用FR的方法,要先引入finereport.js,再通过FR.xxx来调用,如下:

<html>
 <head>
  <script type="text/javascript" src="/WebReport/ReportServer?op=emb&resource=finereport.js"></script>
  <script type="text/javascript">
    var url = FR.cjkEncode("/WebReport/ReportServer?reportlet=Gettingstarted.cpt&地区=华东");
    window.open(url);
  </script>
 </head>
 <body>
 </body>
</html>

对于常用的FR方法,这里列了一张表

方法

返回值

说明

ajax

void

ajax请求

cjkDecode(cjkEncode String)

String

对cjkEncode过的字符串进行反编码

cjkEncode(String)

String

对字符串进行cjkEncode编码

closeDialog()

void

关闭对话框

doHyperlinkByGet(url,config,target,feature)

void

超级链接,get传递config参数到target中,并在feature里面设置窗口属性

doHyperlinkByPost(url,config,target,feature)

void

超级链接,post传递config参数,并将结果显示在target中,并在feature里面设置窗口属性

doURLAppletPrint(printurl,isPopUp,config)

void

applet打印

doURLFlashPrint(printurl,isPopUp,config)

void

flasht打印

doURLPDFPrint(printurl,isPopUp,config)

void

pdf打印

$.isArray(object)

Boolean

是否为数组,是返回true,否返回false

isEmpty(object)

Boolean

是否为空,是返回true,否返回false

jsonDecode(jsonEncode String)

String

对jsonEncode过的字符串进行反编码

jsonEncode(String)

String

对字符串进行jsonEncode编码

showDialog(title, width, height, innerContent)

void

显示一个对话框

这里主要细讲一下Msg和Ajax方法。

1  FR.Msg

FR内置了统一风格的消息框,替代实现了window中的alert、confirm以及prompt。

1.1  FR.Msg.alert方法

使用方法

FR.Msg.alert(title, message, callback),弹出警告框。

title:对话框标题;message:对话框里显示的提示详细;callback:点击确定时调用的方法。

注意,callback是一个function方法,所以在写callback的时候必须为一个方法。

如在某个控件增加编辑结束事件,JS为:FR.Msg.alert("警告","值错误");,在该控件编辑结束后,会看到如下图所示的对话框:

1.2  FR.Msg.confirm方法

使用方法

FR.Msg.confirm(title, message, callback, min_width),弹出带有确认和取消按钮的对话框。

title:对话框标题;message:对话框里显示的提示详细;cellback:点击确定时调用的方法;min_width:表示最小宽度。

如在某个删除按钮中增加点击事件,JS为:FR.Msg.confirm("警告","确认要删除吗?");,点击删除行时会看到,会看到如下图所示的对话框:

注意,此方法无法获取点击“确定”或“取消”的返回值,此方法主要是触发回调函数的。若希望通过返回值的不同来进行下面的操作,则可使用window中的confirm

1.3  FR.Msg.prompt方法

使用方法

FR.Msg.prompt(title, message, value, callback, min_width),可以传递参数的对话框

title:对话框标题;message:对话框里显示的提示详细;callback:点击确定时调用的方法;Value:参数传递的默认值;min_width:表示最小宽度。

如在某个控件增加点击事件,JS为:FR.Msg.prompt("输入","爱好","运动");,在该控件被点击时,会看到如下图所示的对话框:

1.4  FR.Msg.toast方法

使用方法

FR.Msg.toast(message),报表从页面右上角弹出来的那个长条形信息。

message:弹出的信息

如给某个模板增加填报成功事件,JS为:FR.Msg.toast("填报成功");,在点击提交按钮,提交成功后会看到页面的右上角弹出如下对话框:

2  FR.ajax

大家知道JS是前端代码,直接由浏览器来执行,不会与服务器进行交互。

通过AJAX,用户就可以使用JavaScript的XMLHttpRequest对象来直接与服务器进行通信。且在不重载页面的情况下与Web服务器交换数据,也就是所谓的异步请求。

2.1 调用语法

如下ajax示例:

FR.ajax({
   url: "some.jsp",
   type: "GET",
   data: "p1=a&p2=b",
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
});

2.2  ajax中的选项说明

上例中的url、type、data等都是ajax请求设置时的选项,这些选项都是可选的,以下列出常用选项并说明。

async:Boolean

默认为true,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。

注:同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

complete:Function

请求完成后回调函数(请求成功或失败之后均调用)。如下:

FR.ajax({
   url: "some.jsp",
   complete: function(XMLHttpRequest, textStatus){
     alert(this.url);
   }
});

其中参数为XMLHttpRequest 对象和一个描述成功请求是否成功的字符串(成功textStatus=success,否则为error)。

在function中可以通过this.xxx来调用该ajax请求中的选项值。

data:Object/String

发送到服务器的数据。GET请求中将自动转换为请求字符串格式,附加在url后。

值必须是Key/Value格式,可以是字符串如"p1=pavalue&p2=p2value",或者是对象如{p1:p1value,p2:p2value}。

dataType:String

预期服务器返回的数据类型。如果不指定,将自动根据HTTP包MIME信息来智能判断。可用值有:

"xml":返回 XML 文档

"html":返回纯文本HTML信息;包含的script标签会在插入dom时执行。

"script":返回纯文本JavaScript代码。

"json":返回JSON数据。

"text"返回纯文本字符串。

error:Function

请求失败时调用此函数。如下:

FR.ajax({
   url: "some.jsp",
   error: function(XMLHttpRequest, textStatus, errorThrown){
     alert(this.url);
   }
});

其中参数为XMLHttpRequest 对象、错误信息、捕获的异常对象。

通常textStatus和errorThrown之中只有一个会包含信息。

success:Function

请求成功后的回调函数,如下:

FR.ajax({
   url: "/WebReport/a.html",
   success: function(data, textStatus){
     alert(this.url);
   }
});

其中data为服务器返回的,并根据dataType参数进行处理后的数据。textStatus为状态值sucess。

timeout:Number

设置请求超时时间(毫秒)。此设置将覆盖全局设置。

ype:String

请求方式POSTGET,默认为GET。

url:String

发送请求的地址。

关于FS和contentWindow,会在下一节介绍。

Web报表工具FineReport的JS API开发(一)的更多相关文章

  1. Web报表工具FineReport的JS API开发(二)

    上次介绍FineReport的JS API中的第一类开发--FR,这次就来介绍一下FS和contentWindow类的开发. 1 FS FS是数据决策系统中的js接口,比如说FS.tabPane.ad ...

  2. Web报表工具FineReport的JS开发之字符串

    在报表开发过程中,有些需求可能无法通过现有的功能来实现,需要开发人员二次开发,以FineReport为例,可以使用网页脚本.API接口等进行深入的开发与控制. 考虑到JS脚本开发的使用较多,这里先先简 ...

  3. web报表工具FineReport的JS编辑框和URL地址栏语法简介

    JS编辑框: 1.FineReport的js. 作为一款BS产品,browser端的JavaScript是必不可少的. FineReport中的js是已经调用了finereport.js的. 大家知道 ...

  4. web报表工具FineReport使用中遇到的常见报错及解决办法(二)

    web报表工具FineReport使用中遇到的常见报错及解决办法(二) 这里写点抛砖引玉,希望大家能把自己整理的问题及解决方法晾出来,Mark一下,利人利己. 出现问题先搜一下文档上有没有,再看看度娘 ...

  5. web报表工具FineReport常用函数的用法总结(日期和时间函数)

    web报表工具FineReport常用函数的用法总结(日期和时间函数) 说明:凡函数中以日期作为参数因子的,其中日期的形式都必须是yy/mm/dd.而且必须用英文环境下双引号(" " ...

  6. web报表工具FineReport最经常用到部分函数详解

    之前分别列出来了finereport常用的文本.时间函数的解释,这里应广大朋友的要求,整理了finereport最常用到的一些函数! SUM SUM(number1,number2,-):求一个指定单 ...

  7. web报表工具FineReport经常使用函数的使用方法总结(日期和时间函数)

    web报表工具FineReport经常使用函数的使用方法总结(日期和时间函数) 说明:凡函数中以日期作为參数因子的,当中日期的形式都必须是yy/mm/dd.并且必须用英文环境下双引號(" & ...

  8. Web报表工具FineReport二次开发JS之字符串

    在报表开发过程中,有些需求可能无法通过现有的功能来实现,需要开发人员二次开发,以FineReport为例,可以使用网页脚本.API接口等进行深入的开发与控制. 考虑到JS脚本开发的使用较多,这里先先简 ...

  9. Web报表工具FineReport中JavaScript的使用

    报表软件FineReport采用的是jQuery v1.9.2框架,jQuery是一个快速的,简洁的JavaScript库,能让用户更方便地处理HTML documents.events,实现动画效果 ...

随机推荐

  1. ActiveX(三)ActiveX 调用 Js

    在上一篇随笔: ActiveX(二)Js 监听 ActiveX中的事件  中,已经可以实现 Js 监听 ActiveX中的事件,至此.Js 和 ActiveX 已经可以实现双向通讯了.但是.这样的实现 ...

  2. PHP5各个版本的新功能和新特性总结

    因为 PHP 那“集百家之长”的蛋疼语法,加上社区氛围不好,很多人对新版本,新特征并无兴趣.本文将会介绍自 PHP5.2 起,直至 PHP5.6 中增加的新特征 本文目录:PHP5.2 以前:auto ...

  3. Xamarin.ios引用第三方SDK

    引言 诚然,Xamarin是个优秀的跨平台解决方案,但毕竟还是不能将Native中所有的方法都直接实现.诸如各种第三方库,也都只有java/oc原生版本的SDK,无法直接拿过来直接使用.但,不能直接拿 ...

  4. linux下c程序的链接、装载和库(2)

    5. 重定义错误. 一个最终的可执行文件里,绝对不允许出现两个同名的全局变量,也不允许出现同名的全局函数. 全局函数:只要不用 static 修饰符修饰的函数,全部都是全局的. 全局变量:函数外声明定 ...

  5. python基础之数据类型(一)

    Python3 数字(Number) 定义:a=1 特性: 1.只能存放一个值 2.一经定义,不可更改 3.直接访问 分类:整型,长整型,布尔,浮点,复数 python2.*与python3.*关于整 ...

  6. java web学习总结(十六) -------------------数据库连接池

    一.应用程序直接获取数据库连接的缺点 用户每次请求都需要向数据库获得链接,而数据库创建连接通常需要消耗相对较大的资源,创建时间也较长.假设网站一天10万访问量,数据库服务器就需要创建10万次连接,极大 ...

  7. 使用javascript改变图片路径

    效果预览:http://keleyi.com/keleyi/phtml/jstexiao/16.htm 代码如下: <!DOCTYPE html> <html> <hea ...

  8. 原生JS实战:写了个斗牛游戏,分享给大家一起玩!

    本文是苏福的原创文章,转载请注明出处:苏福CNblog:http://www.cnblogs.com/susufufu/p/5869953.html 该程序是本人的个人作品,写的不好,未经本人允许,请 ...

  9. Linux vi/vim(转载)

    Linux vi/vim 所有的 Unix Like 系统都会内建 vi 文书编辑器,其他的文书编辑器则不一定会存在. 但是目前我们使用比较多的是 vim 编辑器. vim 具有程序编辑的能力,可以主 ...

  10. Upgrade from SharePoint 2010 to SharePoint 2016

    [转]http://nikcharlebois.com/upgrade-from-sharepoint-2010-to-sharepoint-2016/ In this blog, I will go ...