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

简介:

上次介绍FineReport的JS API中的第一类开发--FR,这次就来介绍一下FS和contentWindow类的开发。

1 FS

FS是数据决策系统中的js接口,比如说FS.tabPane.addItem,先介绍几类操作:

1.1 FS.Trans.signOut()

退出决策平台系统

1.2 FS.tabPane._doCloseTab(FS.tabPane._getSelectedTab())

关闭当前决策平台的标签

1.3 FS.tabPane.addItem({title:"baidu",src:"http://www.baidu.com"})

在决策平台中打开新标签页

1.4示例

前面两个接口很简单,这里不再举例说明,下面详细介绍一下第三个接口,即在数据决策系统中打开一个新tab。

1.4.1 描述

数据钻取是使用超级链接实现,打开方式有三种,当前窗口,对话框,新窗口。前面2种方式很好理解,第三种在新窗口中打开,即在浏览器端打开一个新的tab页面,如果是在数据决策系统中使用,希望实现在决策系统框架下新增一个tab页签,而不是在浏览器端重新打开一个窗口,这个该怎么实现呢?

1.4.2 模板

下面以%FR_HOME%\demo\basic\DetailedDrillA.cpt为例,该模板中实现了在当前窗口的钻取功能,下面将在当前窗口打开换成在新的tab页面中打开。

1.4.3 超级链接

 

打开模板,进入A4单元格的超级链接设置界面,如下图:


将订单明细的钻取修改成在数据决策中打开一个新的tab页面,新tab页面的标题为订单明细。

 

新增一个JavaScript的超级链接,添加参数ID,参数值为当前单元格的值,即ID=$$$,如下图:




通过

1
window.parent.FS.tabPane.addItem({title: "baidu" ,src: "http://www.baidu.com" })

 

 实现在新的tab中打开页面。

title:订单明细

src:订单明细模板的路径

 

具体如下图:



 

这里要注意,src最后的&符号为参数的传递,即将当前单元格的值传递给参数ID,然后再src的路径后面拼接字符串,将ID参数的值传递给需要打开的新模板中的订单号参数。

代码如下:

1
window.parent.FS.tabPane.addItem({title: "订单明细" ,src: "${servletURL}?reportlet=demo/basic/DetailedDrillB.cpt&订单号=" +ID})

1.4.4 效果查看



 

2 contentWindow

2.1介绍:

contentWindow是在web页面集成的时候,将FineReport报表嵌入在iframe中,调用报表对象时使用的接口,比如说:document.getElementById('reportFrame').contentWindow,其中document.getElementById('reportFrame')是获取iframe对象,contentWindow是报表对象,相当于html中的window对象。

在普通模板的JS脚本中可以直接使用contentWindow下的属性,如直接使用contentWindow中的contentPane,而不用写contentWindow,这是因为js脚本本身就在FR模板中执行。

网页中使用iframe嵌入报表,如果文档包含框架(frame或iframe标签),框架中嵌入了FR报表,则会创建一个contentWindow对象先获取iframe,再调用contentWindow,然后使用contentWindow下面的属性

1
var  contentWindow = document.getElementById( "reportFrame" ).contentWindow.XXX;

不论是web页面集成里面还是直接在FR模板之中,contentWindow下面最常用的属性当属contentPane,所以下面将详细介绍contentPane。

contentPane是contentWidow下面的最常用的一个属性,为存放报表内容的容器。

2. 2引用contentPane

在普通模板的JS脚本中直接使用contentPane就能获取到该对象。

如果报表嵌在网页的iframe中,首先在iframe中获取contentWindow,然后获取属性contentPane对象,如下:

1
var  contentPane = document.getElementById( 'reportFrame' ).contentWindow.contentPane;

比如,需要在网页中获取报表填报页面的一个按钮,并执行点击事件: 

1
document.getElementById( 'reportFrame' ).contentWindow.contentPane.getWidgetByName( '控件名' ).fireEvent( 'click' )

FineReport的填报预览及表单预览下contentPane下都会有一个curLGP对象,即current logicpane。

2.3 引用curLGP

在cpt模板的JS脚本中可以使用contentPane.curLGP来获取该对象。

如果报表嵌在网页的iframe中,在iframe外获取curLGP对象如下:

1
var  contentPane = document.getElementById( 'reportFrame' ).contentWindow.contentPane.curLGP;

2.4 write

填报预览时,curLGP下有一个write对象。

2.4.1 引用write

在cpt模板的JS脚本中可以使用contentPane.curLGP.write来获取该对象。

如果报表嵌在网页的iframe中,在iframe外获取write对象如下:

1
var  contentPane = document.getElementByID( 'reportFrame' ).contentWindow.contentPane.curLGP.write;

2.5 form

表单预览或参数界面,都有一个form对象。

2.5.1引用form

在cpt模板的JS脚本中可以使用this.options.form来获取该对象,如获取参数界面下拉框p1这个控件:

1
var  widget= this .options.form.getWidgetByName(p1)

如果报表嵌在网页的iframe中,在iframe外获取form对象如下:

1
var  contentPane = document.getElementByID( 'reportFrame' ).contentWindow.contentPane.curLGP.form;




本文转自 雄霸天下啦 51CTO博客,原文链接:http://blog.51cto.com/10549520/1754295,如需转载请自行联系原作者
相关文章
|
3天前
|
自然语言处理 搜索推荐 数据挖掘
淘宝商品描述 API 接口的开发、应用与收益
淘宝商品描述API接口的开发与应用涵盖注册成为开发者、了解API规范、选择开发工具及语言(如Python)和实现代码调用。该接口可用于优化电商平台商品展示、同步数据、竞品分析、智能客服及个性化推荐,从而提高销售转化率、降低运营成本并拓展业务机会。通过自动化处理和数据分析,企业能更精准地满足消费者需求,提升竞争力。
27 9
|
18天前
|
API 数据安全/隐私保护 UED
探索鸿蒙的蓝牙A2DP与访问API:从学习到实现的开发之旅
在掌握了鸿蒙系统的开发基础后,我挑战了蓝牙功能的开发。通过Bluetooth A2DP和Access API,实现了蓝牙音频流传输、设备连接和权限管理。具体步骤包括:理解API作用、配置环境与权限、扫描并连接设备、实现音频流控制及动态切换设备。最终,我构建了一个简单的蓝牙音频播放器,具备设备扫描、连接、音频播放与停止、切换输出设备等功能。这次开发让我对蓝牙技术有了更深的理解,也为未来的复杂项目打下了坚实的基础。
101 58
探索鸿蒙的蓝牙A2DP与访问API:从学习到实现的开发之旅
|
5天前
|
人工智能 前端开发 API
Gemini Coder:基于 Google Gemini API 的开源 Web 应用生成工具,支持实时编辑和预览
Gemini Coder 是一款基于 Google Gemini API 的 AI 应用生成工具,支持通过文本描述快速生成代码,并提供实时代码编辑和预览功能,简化开发流程。
72 38
Gemini Coder:基于 Google Gemini API 的开源 Web 应用生成工具,支持实时编辑和预览
|
9天前
|
安全 搜索推荐 数据挖掘
虾皮店铺商品API接口的开发、运用与收益
虾皮(Shopee)作为东南亚领先的电商平台,通过开放API接口为商家和开发者提供了全面的数据支持。本文详细介绍虾皮店铺商品API的开发与运用,涵盖注册认证、API文档解读、请求参数设置、签名生成、HTTP请求发送及响应解析等步骤,并提供Python代码示例。API接口广泛应用于电商导购、价格比较、商品推荐、数据分析等场景,带来提升用户体验、增加流量、提高运营效率等收益。开发者需注意API密钥安全、请求频率控制及遵守使用规则,确保接口稳定可靠。虾皮API推动了电商行业的创新与发展。
65 31
|
7天前
|
监控 搜索推荐 API
京东JD商品详情原数据API接口的开发、运用与收益
京东商品详情API接口是京东开放平台的重要组成部分,通过程序化方式向第三方提供商品详细信息,涵盖名称、价格、库存等。它促进了京东生态系统的建设,提升了数据利用效率,并推动了企业和商家的数字化转型。开发者可通过注册账号、获取密钥、调用接口并解析返回结果来使用该API。应用场景包括电商平台的价格监控、竞品分析、个性化推荐系统开发、移动应用开发及数据整合与共享等。该接口不仅为企业和开发者带来商业价值提升、用户体验优化,还助力数据资产积累,未来应用前景广阔。
36 9
|
11天前
|
存储 搜索推荐 API
拼多多根据ID取商品详情原数据API接口的开发、运用与收益
拼多多作为中国电商市场的重要参与者,通过开放平台提供了丰富的API接口,其中根据ID取商品详情原数据的API接口尤为重要。该接口允许开发者通过编程方式获取商品的详细信息,为电商数据分析、竞品分析、价格监测、商品推荐等多个领域带来了丰富的应用场景和显著的收益。
40 10
|
4天前
|
存储 JSON API
小红书获取笔记详情API接口的开发、应用与收益。
小红书笔记详情API采用Python与Django框架开发,使用MySQL数据库存储数据。接口通过HTTP GET请求获取笔记详情,返回JSON格式数据,包含笔记内容、作者信息、图片链接等。该API应用于小红书APP内笔记展示和互动功能,并支持第三方平台的内容整合与数据分析,提升用户体验与活跃度,促进品牌合作推广,优化平台运营效率,为平台带来显著收益。
28 1
|
1月前
|
Kubernetes 安全 Devops
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
66 10
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
|
10天前
|
JSON 供应链 搜索推荐
淘宝APP分类API接口:开发、运用与收益全解析
淘宝APP作为国内领先的购物平台,拥有丰富的商品资源和庞大的用户群体。分类API接口是实现商品分类管理、查询及个性化推荐的关键工具。通过开发和使用该接口,商家可以构建分类树、进行商品查询与搜索、提供个性化推荐,从而提高销售额、增加商品曝光、提升用户体验并降低运营成本。此外,它还能帮助拓展业务范围,满足用户的多样化需求,推动电商业务的发展和创新。
31 5
|
17天前
|
存储 API 计算机视觉
自学记录HarmonyOS Next Image API 13:图像处理与传输的开发实践
在完成数字版权管理(DRM)项目后,我决定挑战HarmonyOS Next的图像处理功能,学习Image API和SendableImage API。这两个API支持图像加载、编辑、存储及跨设备发送共享。我计划开发一个简单的图像编辑与发送工具,实现图像裁剪、缩放及跨设备共享功能。通过研究,我深刻体会到HarmonyOS的强大设计,未来这些功能可应用于照片编辑、媒体共享等场景。如果你对图像处理感兴趣,不妨一起探索更多高级特性,共同进步。
71 11