最新历史版本 :JS自定义提交按钮 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 问题描述

如果您定义了一个自定义按钮实现了一些您自己的业务逻辑,但是您也想这个按钮实现提交入库的操作,那如何在自定义按钮中实现 FineReport 的提交操作呢?

1.2 解决思路

在自定义按钮中添加一个 点击事件,利用 FineReport 提供的 JS 接口方法来实现当点击按钮时执行提交操作。接口说明可参考:填报预览专有

2. 示例编辑

2.1 准备模板

打开模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\LineForm\LineForm.cpt

在 B1 单元格中添加一个按钮控件,设置按钮类型为「普通」,按钮名字为「提交」。如下图所示:

1614850456700641.png

2.2 设置点击事件

选中提交按钮所在 B1 单元格,添加一个点击事件:

 JavaScript 代码如下:

_g().verifyAndWriteReport();
//校验并提交

该代码实现的效果和点击工具栏的提交按钮一致,如果需要其他提交效果,修改为对应的接口即可。

2.3 效果预览

保存报表,点击「填报预览」,随便修改一个数据,点击提交按钮,提示「成功」后,预览数据库查询,即可看到此数据填报成功。如下图所示:

222

支持移动端预览,效果如下图所示:

Screenshot_20220822_161303_com.finereact.v11.jpg

3. 模板下载编辑

已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\填报预览JS实例\JS自定义提交按钮.cpt

点击下载模板:JS自定义提交按钮.cpt