Fork me on GitHub

SAP Adobe Form 教程六 FormCalc和JavaScript的实践

前文:

SAP Adobe Form 教程一 简单示例

SAP Adobe Form 教程二 表

SAP Adobe Form 教程三 日期,时间,floating field

SAP Adobe Form 教程四 动态隐藏和显示字段

SAP Adobe Form 教程五 图片

SAP Adobe Form 几种文本类型

 

在本文中,我们将演示在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,写入代码,

 

 代码如下,

 

输出结果,

 

posted @ 2021-11-08 12:58  氢氦  阅读(1995)  评论(0编辑  收藏  举报