SAP Adobe Form 教程六 FormCalc和JavaScript的实践
前文:
SAP Adobe Form 教程三 日期,时间,floating field
在本文中,我们将演示在FormCalc中使用SUM,然后在SAP Adobe forms中使用JavaScript动态更改文本样式。
使用脚本的主要优点是,我们可以改进功能,并且可以在运行期间动态地控制表单。
SAP Adobe Form 支持2种脚本语言:
- FormCalc
- JavaScript
这两种脚本语言各有优缺点,可以根据需要决定使用哪种。本文将提供两种脚本语言的一些常见业务场景。
注意,之前已经有一篇涉及Javascript的文章,可以参考:SAP Adobe Form 教程四 动态隐藏和显示字段
本文链接:https://www.cnblogs.com/hhelibeb/p/15522710.html
原文标题:SAP Adobe Form Tutorial. Part XVI. Practical Use Case of FormCalc and JavaScript
前提
- SAP Adobe Form的table相关的基础知识
- 对JavaScript和FormCalc基本功能的了解
- ABAP编码能力
业务需求
1. 在发送给客户的详细报表中,我们希望在所有行项目末尾显示总金额和总单位小计。
2. 在语句的描述部分,我们希望以粗体和不同的样式显示层次结构的标题产品,以便很容易在整个语句中识别标题产品。
解决方案
我们需要创建一个Adobe Form和与全局数据的interface。我们将在interface的“code initialization”中的全局数据内表中添加一些测试数据,然后将这些全局内表与adobe form layout中的UI表绑定。
另外,我们还可以通过在驱动程序中编写处理逻辑并将所需的内部表作为adobe form的导入参数传递来实现这一点。因为这个博客更多的是关于脚本的使用,所以没有考虑数据处理的最佳方法。
步骤
1,在事务代码SFP创建interface ZPB_TEST_SCRIPTS。
2,创建2个全局变量内表,details和descriptions。
3,表类型ZPB_TEST_DESCR、ZPB_TEST_DETAILS的结构如下,
4,前往code initialization,为内表填入测试数据,
5,前往事务SFP,创建新form,添加interface ZPB_TEST_SCRIPTS。
6,拖放全局变量到context。
7,前往Layout用这两个全局变量创建表格。
a, 前往Data View,
b,选择GT_DETAILS,拖放到Layout的Detail页,
c,你会看到表格自动创建,并绑定了GT_DETAILS。
d,为小计创建页脚行。前往Hierarchy,展开GT_DETAILS,在DATA后创建一个新的行。前往新行的Object,变更行类型为Footer。
请注意,如果我们使用“表格助手”创建表格,则会自动创建页脚。因为前往是通过Data View创建的表格,所以必须手动创建页脚。
下一步是写Formcalc脚本的步骤。
8, 在“NET_UNITS”下的页脚中选择文本字段,然后转到脚本编辑器,
9,现在转到“Show Events”下拉列表,你会发现所有事件都显示为灰色。为什么?
这是因为对于少数UI元素类型,不允许编写脚本,这就是为什么所有事件都仅处于显示模式。要启用事件并编写脚本逻辑,我们需要将UI元素的类型从“Text”更改为“Text Field”。
10,修改NET UNITS和TOTAL ROYALTIES的页脚字段为“Text Field”。
可以注意到,对于上面高亮显示的字段,边框颜色已更改为红色,而对于其他字段,边框颜色仍为蓝色。颜色是标识文本用户界面或文本字段用户界面的指示器
接着,重复步骤8和9,选择合适的事件来编写脚本。
需求是求和、显示小计。
11,选择Calculate事件,语言选择为Formcalc。
写入SUM代码。sum (DATA[*].NET_UNITS)
12,创建一个测试驱动程序以生成结果pdf(请参阅以前的博客以创建用于测试Adobe forms的驱动程序),并生成一个包含小计的pdf:
通过使用FormCalc本的一个求和函数,我们可以在Adobe forms中计算表中行项目的和,不需要使用任何ABAP逻辑。
FormCalc文档:https://helpx.adobe.com/pdf/aem-forms/6-2/formcalc-reference.pdf
JS的使用例子
13,重复步骤7的a-c部分,在Data View为description创建另一个表,使用全局变量GT_DESCRIPTION。
还记得另一个业务需求吗?我们需要在运行期间根据粗体/斜体设置将描述字段中的标题产品设置为粗体,并使用不同的文本样式和项目设置为斜体。
14,在Hierarchy中选择GT_DESCRIPTION的DATA行,前往脚本编辑器。
15,选择“form : ready”事件,语言为Javascript,写入代码,
代码如下,
输出结果,