1. 概述
1.1 应用场景
在我们使用填报表时，不希望使用 FineReport 内置的工具栏的按钮，希望能够自定义提交按钮，将数据入库。
1.2 功能简介
自定义按钮既可以是 FineReport 模板中添加的按钮控件，也可以是 Web 集成页面中，HTML 的按钮标签。
1）FineReport 模板中的按钮控件实现自定义提交操作详细请参照 自定义按钮中实现提交操作
2）而在 Web 页面中，点击 HTML 中的按钮提交 iframe 中的 FineReport 报表将在本文详述。效果如下图所示:
1.3 实现思路
FineReport 内置的报表提交 JS 代码是contentPane.writeReport()，如果是调用嵌入的报表提交功能的话，使用document.getElementById('报表所在iframe的id').contentWindow.contentPane.writeReport();
注：contentPane 代码介绍请参见：contentPane ；document 对象介绍请参见：document对象
2. 示例一：点击按钮提交单张模板
2.1 模板准备
使用模板：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FreeFrom\FreeForm.cpt
2.2 新建 HTML 文件
1）新建 write.html，内容如下：
点击下载文件：write.html
<html>
<head>
<title>自定义提交按钮</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<div id="toolbar">
<button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.writeReport()">提交</button>
</div>
<iframe id="reportFrame" onload="afterload()" src="/webroot/decision/view/report?viewlet=doc/Form/FreeFrom/FreeForm.cpt&op=write&__showtoolbar__=false" width = 100% height = 80%></iframe>
</body>
</html>
2）将 write.html 放置到 %FR_HOME%\webapps\webroot\help\page_demo 路径下，如下图所示：
2.3 效果预览
打开服务器，在浏览器端输入http://localhost:8075/webroot/help/page_demo/write.html，效果如下图所示：
3. 示例二：点击按钮提交多张模板
注：不支持移动端。
3.1 模板准备
1）下载网页框控件插件，具体可参见：在决策报表中使用网页框控件
2）准备两张填报模板，本文示例准备模板为：
%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FreeFrom\FreeForm.cpt
%FR_HOME%\webapps\webroot\WEB-INF\reportlets\demo\form\填报可暂存.cpt
3.2 添加网页框控件
1）在决策报表中拖入一个网页框控件，命名为aa，「模板路径」为FreeForm.cpt模板所在路径，参数为op，值为write，如下图所示：
2）再拖入一个网页框控件，命名为bb，「模板路径」为填报可暂存.cpt模板所在路径，参数为op，值为write，如下图所示：
3.3 添加按钮控件
在决策报表中添加按钮控件，并为其添加点击事件，JavaScript 代码如下所示：
注：「AA」和「BB」为网页框控件名称，需全部大写。
document.getElementsByName("AA")[0].contentWindow.contentPane.writeReport();
document.getElementsByName("BB")[0].contentWindow.contentPane.writeReport();
3.4 效果预览
点击「PC端预览」按钮，效果如下图所示：
3.5 已完成模板
已完成模板可参见：%FR_HOME%\webroot\WEB-INF\reportlets\doc\frm\点击按钮提交多张模板.frm
点击下载模板：点击按钮提交多张模板.frm