Web报表工具FineReport的JS API开发（一）
很多报表软件可以利用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开发（一）的更多相关文章
- Web报表工具FineReport的JS API开发（二）
上次介绍FineReport的JS API中的第一类开发--FR,这次就来介绍一下FS和contentWindow类的开发. 1 FS FS是数据决策系统中的js接口,比如说FS.tabPane.ad ...
- Web报表工具FineReport的JS开发之字符串
在报表开发过程中,有些需求可能无法通过现有的功能来实现,需要开发人员二次开发,以FineReport为例,可以使用网页脚本.API接口等进行深入的开发与控制. 考虑到JS脚本开发的使用较多,这里先先简 ...
- web报表工具FineReport的JS编辑框和URL地址栏语法简介
JS编辑框: 1.FineReport的js. 作为一款BS产品,browser端的JavaScript是必不可少的. FineReport中的js是已经调用了finereport.js的. 大家知道 ...
- web报表工具FineReport使用中遇到的常见报错及解决办法（二）
web报表工具FineReport使用中遇到的常见报错及解决办法(二) 这里写点抛砖引玉,希望大家能把自己整理的问题及解决方法晾出来,Mark一下,利人利己. 出现问题先搜一下文档上有没有,再看看度娘 ...
- web报表工具FineReport常用函数的用法总结（日期和时间函数）
web报表工具FineReport常用函数的用法总结(日期和时间函数) 说明:凡函数中以日期作为参数因子的,其中日期的形式都必须是yy/mm/dd.而且必须用英文环境下双引号(" " ...
- web报表工具FineReport最经常用到部分函数详解
之前分别列出来了finereport常用的文本.时间函数的解释,这里应广大朋友的要求,整理了finereport最常用到的一些函数! SUM SUM(number1,number2,-):求一个指定单 ...
- web报表工具FineReport经常使用函数的使用方法总结（日期和时间函数）
web报表工具FineReport经常使用函数的使用方法总结(日期和时间函数) 说明:凡函数中以日期作为參数因子的,当中日期的形式都必须是yy/mm/dd.并且必须用英文环境下双引號(" & ...
- Web报表工具FineReport二次开发JS之字符串
在报表开发过程中,有些需求可能无法通过现有的功能来实现,需要开发人员二次开发,以FineReport为例,可以使用网页脚本.API接口等进行深入的开发与控制. 考虑到JS脚本开发的使用较多,这里先先简 ...
- Web报表工具FineReport中JavaScript的使用
报表软件FineReport采用的是jQuery v1.9.2框架,jQuery是一个快速的,简洁的JavaScript库,能让用户更方便地处理HTML documents.events,实现动画效果 ...
随机推荐
- ASP.NET MVC对WebAPI接口操作(添加，更新和删除)
昨天<怎样操作WebAPI接口(显示数据)>http://www.cnblogs.com/insus/p/5670401.html 既有使用jQuery,也有使作HttpClient来从数 ...
- .NET多线程总结和实例介绍
摘要:.Net提供了许多多线程编程工具,可能是因为太多了,所以掌握起来总是有一些头疼,我在这里讲讲我总结的一些多线程编程的经验,希望对大家有帮助. 1.多线程的总结 不需要传递参数,也不需要返回参数 ...
- android 网络加载图片，对图片资源进行优化，并且实现内存双缓存 + 磁盘缓存
经常会用到 网络文件 比如查看大图片数据 资源优化的问题,当然用开源的项目 Android-Universal-Image-Loader 或者 ignition 都是个很好的选择. 在这里把原来 ...
- C++_系列自学课程_第_9_课_C语言风格字符串_《C++ Primer 第四版》
前面说了写关于数组和指针的内容,这次在这里讨论一下字符串,讨论一下C语言风格的字符串. 在C语言里面我们利用字符数组来对字符串进行处理, 在C++里面我们前面说过一种类类型string可以对字符串进行 ...
- 关于在云服务器上部署tomcat笔记
tomcat无法启动的原因有:1.由于在tomcat里JVM没有配好,他默认的是批向c:\program file\Java下的那一个,如果你确认 这没有删掉,JVM指向你自己安装的jdk\jre试试 ...
- JDK源码分析：hashCode()方法
提问: 1.hashCode()源码是怎么实现的. 2.hashCode()是为了配合基于散列的集合而设计的 3.hash数据结构,如何做到存取的时间复杂度为O(1)的.{函数算>逐个比较} 答 ...
- 【算法】PHP实现冒泡排序和快速排序--防遗忘
有没有这样的感觉,排序算法虽然简单,但是没看过一次,一会就又忘了,所以有必要 自己使用实际的代码运行实现,才记忆牢固,为此Mark //需求:将数组中元素,从大到小排列$a = array(11, 2 ...
- 通过Laravel 初识Vue.js
最近也在学习laravel的框, 因为之前学过tp框架, 都说laravel是最优雅的框架,所以开学后忍不住去试试这个在国外已经火的不要不要的框架. 总的来说,对于学习完tp框架后,我觉得tp毕竟是中 ...
- [ASP.NET Core] Getting Started
前言 本篇文章介绍如何快速建立一个ASP.NET Core应用程序,为自己留个纪录也希望能帮助到有需要的开发人员. ASP.NET Core官网 环境 建立一个ASP.NET Core应用程序,首先要 ...
- js鼠标滚轮滚动图片切换效果
效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...