IBM®
跳转到主要内容
    中国 [选择]    使用条款
 
 
Select a scope: Search for:    
    首页    产品    服务与解决方案     支持与下载    个性化服务    
跳转到主要内容

developerWorks 中国  >  XML  >

探究 Lotus Forms 中的事件处理 , 第一部分 : XForm 表单对计算功能的支持

developerWorks
文档选项

未显示需要 JavaScript 的文档选项

讨论


级别: 中级

李旭 (christli@cn.ibm.com), 软件工程师, Systems Documentation, Inc. (SDI)

2008 年 9 月 01 日

Lotus Forms 通过构建动态的电子表单,收集用户信息并将其传递给其他应用系统,以实现业务流程的管理。与纸质表单相比,XForm 电子表单的最大优势之一就是能够动态地响应用户活动。如,根据用户输入动态改变背景颜色,响应鼠标点击事件发送邮件或提交表单,等等。本文将通过若干实例,向您详细讲述 Lotus Forms 中对计算功能的支持。作为复杂事件处理的基础,计算功能允许设计者通过编程实现表单对用户活动的响应。

Lotus Forms 概述

Lotus Forms 提供了一种以 XForm 电子表单的形式收集用户信息并将其传递给其他应用系统的方式。它可以作为业务流程的前端,例如申请保险索赔。当用户完成表单进行提交后,这些用户信息就会作为输入传输给业务流程、数据库,或者其他类型的应用系统。Lotus Forms 是一个产品家族,它包括三种产品:

  • Lotus Forms Designer :该产品是一个基于 Eclipse 的图形化设计工具,用于创建和编辑 XFDL 表单。
  • Lotus Forms Viewer :该产品帮助用户查看、填写和提交表单。Viewer 不但可以作为插件内嵌于浏览器中,也可以独立于浏览器作为单独的应用运行。
  • Lotus Forms Server :该产品包含四个组件,分别为
    • API –提供用于应用和扩展 Lotus Forms 功能的函数集合。
    • Deployment Server –通过 Applet 技术,帮助用户自动安装所需软件,如 Viewer。
    • Forms Services Platform –提供用于实现 Lotus Forms 与其他系统集成的函数库。
    • Webform Server –用于将 XFDL 表单文件翻译成 HTML/JavaScript 文档,使得用户可以在浏览器中填写和提交表单,而不需要其他软件支持。

本文主要涉及的产品是 Lotus Forms Designer 3,重点讨论在表单设计阶段如何为表单注入丰富的事件处理功能。整篇文章主要包含以下内容:第二部分对 Lotus Forms 表单所使用的描述语言(XFDL)进行简要的介绍,以便更好地理解本文所引用的示例表单代码;第三部分讨论 Lotus Forms 表单中对计算功能的支持,包括 Designer 工具的使用以及实现代码;最后一部分是结束语。在本系列的第二篇文章中 , 我们将讨论 Lotus Forms 中为表单设计提供的主要函数支持以及 Lotus Forms 表单中对事件和活动处理的支持。

表单定义语言–XFDL

在 Lotus Forms 中设计和处理的表单是使用扩展表单描述语言(XFDL)进行定义的。XFDL 使用可扩展标记语言(XML)提供一种为便于数字化存储和显示而定义数据字段和企业或政府复杂表单设计的标准方法 , 它将先前开发的全球表格定义语言(UFDL)和 XML 结合了起来。

在本小节中,我们将首先以一个实际的 XFDL 表单代码为例(如清单 1 所示),向您介绍 XFDL 表单的基本结构,让您对 XFDL 表单有个感性的认识。接下来,我们将把 XFDL 表单的组织结构抽象成数据模型,更加详细地向您介绍表单中的基本组成元素。

从一个简单的 XFDL 表单开始


清单 1. 一个简单的 XFDL 表单
 0 < ?xml version="1.0" encoding="UTF-8"?>
 1 <XFDL xmlns="http://www.ibm.com/xmlns/prod/XFDL/7.5"
 2 xmlns:xfdl="http://www.ibm.com/xmlns/prod/XFDL/7.5"
 3 xmlns:xforms="http://www.w3.org/2002/xforms">
 4 <globalpage sid="global">
 5 <global sid="global">
 6 <xformsmodels>
 7 <model xmlns="http://www.w3.org/2002/xforms">
 8 <instance>
 9 <data xmlns="">
 10 <a>3</a>
 11 <b></b>
 12 </data>
 13 </instance>
 14 <bind nodeset=”b” calculate=”../a * ../a”/> 
 15 </model>
 16 </xformsmodels>
 17 <bgcolor>lightgrey</bgcolor>
 18 </global>
 19 </globalpage>
 20 <page sid="PAGE1">
 21 <global sid="global">
 22 <label>Square Area Form</label>
 23 <bgcolor>cornsilk</bgcolor>
 24 <fontinfo>
 25 <fontname>Times</fontname>
 26 <size>24</size>
 27 <effect>plain</effect>
 28 </fontinfo>
 29 </global>
 30 <field sid="side">
 31 <xforms:input ref="a">
 32 <xforms:label>Length of square side :</xforms:label>
 33 </xforms:input>
 34 <labelfontinfo>
 35 <fontname>Times</fontname>
 36 <size>24</size>
 37 <effect>bold</effect>
 38 </labelfontinfo>
 39	 </field>
 40 <field sid="area">
 41 <xforms:input ref="b">
 42 <xforms:label>Area of square:</xforms:label>
 43 </xforms:input>
 44 <labelfontinfo>
 45 <fontname>Times</fontname>
 46 <size>24</size>
 47 <effect>bold</effect>
 48 </labelfontinfo>
 49 </field>
 50	</page>
 51 </XFDL>	
 			
 

粗略浏览上表所示的 XFDL 表单代码 , 我们可以看出这是一个以 XFDL 为根元素的 XML 文档。表单中引入了 XForms 创建数据模型。表单的主体是一个页面的定义,其中包含了若干 GUI 控件(field)以及对样式的定义。这是一个非常简单的 XFDL 表单,但却包含了大部分 XFDL 的基本元素。接下来,我们将为您逐行进行讲解。

  • 1-3 行:这部分是对命名空间的声明。
  • 4-19 行:这部分用来指定表单的全局设置。这些设置将被应用到表单中的所有页面,也就是说,表单中的所有页面都将继承这些全局设置,而且页面中的设置可以覆盖表单的全局设置。在本例中,6-16 行定义了一个 XForms 数据模型。在 xformsmodels 选项(option)中可以定义多个 model 元素,一个 model 元素包含三个核心的子元素:
    • 数据实例(Data Instance):任意的 XML 片断,用于定义数据的结构。本例中 , 数据实例包含两个元素,a 表示正方形的边,b 表示正方形的面积。
    • 绑定(binding):用于关联数据层和展示层。本例中,b 的值是通过计算边长 a 的平方得来的。
    • 提交(submission):定义数据提交规则。每个数据实例都可以关联到多个提交规则。
  • 20-50 行:这部分用来定义标单中的页面。其中,21-29 行指定页面的全局设置。30-49 行定义表单页面中的两个字段分别绑定到数据实例中的 a 元素和 b 元素。

洞悉 XFDL 表单结构

当一个 XFDL 表单被加载到内存中之后,该表单可以看成是由一系列链接的节点组成的一棵树。每个节点都代表一个表单元素,具有 4 个属性(根据节点类型的不同,这些属性中有些可能为空):

  • Type: 表示节点的类型。例如本例中的 page 表示表单中的页面类型 , field 表示页面中的字段类型等等。
  • Literal: 表示节点的值。例如本例中,第一个字段的初始值是 3,第二个字段的值通过计算后得出是 9。
  • IDEntifier: 表示该节点的惟一标识符。例如本例中,page 元素的标识符是 PAGE1 ( 由 sid 属性指定 )。
  • Compute: 表示赋值给该节点的计算语句。

并且树中的节点具有以下几种类型(按照降序排列):

  • 表单 (form)。每个电子表单都有一个表单级的节点,即树的根节点。
  • 页 (page)。每个电子表单都有一些以表单节点的子孙形式表示的页。每个电子表单至少有两个页节点:一个是全局页,用来存储全局设置;另外一个是电子表单的首页。
  • 项 (item)。每个页中都包含一些电子表单项。每个页至少包含一个全局项来为该页设置全局属性。
  • 选项 (option)。每个项都包含一些选项。
  • 参数 (argument)。每个选项都可以包含一些设置或参数。

根据以上关于节点类型和节点属性的定义,我们可以将清单 1 中的示例表单示意为树结构(部分节点),如图 1 所示。


图 1. 树的结构
 树的结构

引用

引用提供了到节点层次中每个项的路径,其语法遵循一般模式 page.item.option[argument] 。例如,清单 1 所示的表单中,要引用页 PAGE1 中 global 项的背景颜色的值,我们使用的语法应该为:PAGE1.global.bgcolor。

现在,相信您已经对 XFDL 表单的组织结构及其元素的相关概念已经有了比较清晰的认识,接下来,我们将开始进入 XFDL 表单中关于计算、函数和事件处理的讨论。

构建动态的电子表单 - 计算

XFDL 计算的基本概念

XFDL 中的计算可以看成一个公式或表达式,应用于表单中的选项元素 (option)。通过引入计算,您可以通过编程实现表单对用户活动的响应。例如,当表单的文本字段获得焦点时 , 自动改变文本框颜色等。

Lotus Forms Designer 中提供了一个计算编辑器(compute editor)帮助用户构造计算表达式。XFDL 计算可以是数学表达式或条件表达式。条件表达式的格式包括三个部分(如清单 2 所示)。其中,第一部分 (comparison) 表达式的结果为一个布尔值,如果为真,则执行第二部分 (true part) 的计算,否则,执行第三部分 (false part) 的计算。例如清单 3 中的示例代码,表示如果表单字段 FIELD1 获得焦点而且表单字段 FIELD2 值为空的话,将表单字段 FIELD1 的背景颜色设置为灰色,否则为蓝色。其中,在计算表达式中允许使用的运算符请见表格 1。


清单 2. 条件表达式结构
comparison ? true part : false part
 


清单 3. 条件表达式示例
<field sid=”FIELD1”>
 … 
 <bgcolor compute=” FIELD1.focused == 'on' and FIELD2.value == '' ? 
 'gray' : 'blue'”></bfcolor>
 …
</field>	
 


表 1. XFDL 计算中使用的运算符
类型 运算符 描述
算术运算符 +
-
*
/
% 求模
^ 指数
关系运算符 == 等于
< 小于
> 大于
<= 小于等于
>= 大于等于
!= 不等于
逻辑运算符 and (&&) 逻辑与
or (|) 逻辑或
not (!) 逻辑非
其他 +. 字符串或函数并置

注意 : (1) 逻辑运算符 and, or , not 必须为小写字母。(2) 在编辑 XFDL 表单源代码时,必须使用实体引用符来表示 "<" 和 "&" ,请参考表格 2。虽然只有 "<" 字符和 "&" 字符对于 XML 来说是严格禁止使用的,剩下的都是合法的,为了减少出错,使用实体引用符是一个好习惯。


表 1. XFDL 计算中使用的运算符
特殊符号 实体引用符
<&lt;
&&amp;
'&apos;
"&quot;
>&gt;

XFDL 计算的高级功能

使用函数

在计算表达式中可以使用函数实现特定的功能 , 如清单 4 所示,代码表示将表单字段 FIELD1 的背景颜色设置为红色。计算中使用的函数可以是 XFDL 提供的标准函数,也可以是用户定制的函数。关于函数的详细内容,请参考文章第四部分的介绍。


清单 4. 计算中使用函数
set('FIELD1.bgcolor','red')
 

复杂计算

XFDL 计算可以使用并置运算符 (+.) 将多个字符串或函数关联起来,从而实现更加复杂的计算功能。如清单 5 所示的代码,实现了在表单提交的时候完成对数据的验证。具体的实现过程可以描述为 :

  • 使用 toggle 函数检测用户是否点击了提交按钮
  • 如果用户点击了提交按钮,触发 xmlmodelvalidate 函数调用
  • 使用 set 函数,将 xmlmodelValidate 函数的执行结果赋予定制的选项 <custom: results >
  • 使用 strlen 函数决定 xmlmodelValidate 函数返回的结果是否指明数据验证失败
    • 如果数据验证成功,结果字符串应该为空,因此字符串的长度应该为 0
    • 如果数据验证失败,结果字符串的长度应该大于 0
  • 如果数据验证失败
    • 使用 messagebox 函数将 xmlmodelValidate 函数返回的结果展示给用户
    • 使用 set 函数使提交按钮失效,从而终止本次提交操作

清单 5. 复杂的计算
<button sid="submitForm">
 <value>Submit</value>
 <type>done</type> 
 <custom:results></custom:results>
 	 <custom:opt xfdl:compute="toggle(activated, 'off', 'on') &#xA;
 	 == '1' ? &#xA;
 	 set('custom:results', xmlmodelValidate()) &#xA;
 	 +. (strlen(custom:results) > '0' &#xA;
 	 ? viewer.messageBox(custom:results) &#xA;
 	 +. set('activated', 'off'): '') : '' "> &#xA;
 	 </custom:opt>
</button>
 

注意:由于以上代码中计算表达式过于复杂,为了便于阅读和维护,我们将其分成了若干行。如果您使用计算编辑器编写该计算表达式的话,不必考虑分行的问题,但如果您习惯于编写表单源代码的话,您将会发现,当您再次加载该表单时,原来使用换行符分隔的代码又都合为了一行,这是由于 XML 处理器导致的。为了避免这样的问题,我们可以在每行的行尾加上一个 XML 实体 &#xA;。

使用计算编辑器构建计算

在使用 Lotus Forms Designer 设计表单时,您可以使用计算编辑器来编写复杂的计算表达式,也可以直接编写表单源码。在这里,我们建议您尽量使用计算编辑器来完成对计算表达式的编写,因为它能够帮助您快速、准确地构建计算,避免不必要的人为错误和时间上的浪费。接下来,我们就以清单 5 中的代码为例,向您展示如何使用计算编辑器构造出一个复杂的 XFDL 计算。

1. 在 Lotus Forms Designer 的设计面板中右键点击提交按钮,从弹出菜单中选择 Compute 编辑器,打开计算编辑器窗口。


图 2. Compute 编辑器界面
Compute 编辑器界面

2. 从快速启动的下拉列表中,选择 onButtonClick,构造当用户点击按钮时的操作。


图 3. 快速启动菜单
 快速启动菜单

3. 此时,在代码编辑框中会出现以下的代码片断


清单 6. 代码片断
toggle(activated,‘off’,‘on’) == ‘1’? action : ‘’
 

4. 在选项下拉列表中,选择 cutom:opt,指明为该选项创建计算表达式。


图 4. 选择选项
 选择选项

5. 现在开始构造点击按钮后的操作。双击代码编辑框中的 action,点击函数菜单,弹出函数编辑窗口。从左边的函数列表中,展开 Utility,选择 set 函数。此时,在窗口下方的代码编辑框中,action 已被 set 函数取代。接下来,我们需要为 set 函数指定正确的参数。第一个参数为提交按钮的选项 custom : result,在参数面板中,选择 reference,并在其右侧的 reference 面板中点击表单项菜单。


图 5. 选择 set 函数
 选择选项

6. 在弹出的选择表单项窗口中,从左边的可用表单项面板中,选择提交按钮的标识符 (BUTTON1), 将其添加到右边的面板中。从选项下拉列表中,选择 custom:results,点击确定按钮以关闭该窗口。


图 6. 构造 set 函数的第一个参数
 构造 set 函数的第一个参数

7. 此时,在函数窗口的代码编辑框中,我们看到 set 函数的第一个参数已经构造完毕。接下来,开始指定第二个参数,即 xmlmodelValidate 函数。在参数面板中选择 value,然后在右边的 value 面板中点击函数菜单。


图 7. 代码片断
 代码片断

8. 在弹出的函数编辑窗口中 , 从左边的函数面板中,展开 Utility,选中 xmlmodelValidate 函数,点击确定,关闭该窗口。


图 8. 构造 set 函数的第二个参数
 构造 set 函数的第二个参数

9. 返回 Compute 编辑器窗口,我们看到 set 函数已经构造完毕,由于第二个参数是一个函数,因此,我们需要将其两边的单引号去掉。其代码如下图所示


清单 7. 代码片断
toggle(activated,‘off’,‘on’) == ‘1’? 
set(‘PAGE1.BUTTON1.custom:results’, xmlmodelValidate()) : ‘’
 

10. 接下来,我们需要在 set 函数后关联另外一个条件表达式,用于判断数据验证的结果。将光标置于 set 函数之后,点击操作下拉列表,选择函数并置 (+.) 操作。


图 9. 关联操作
 关联操作

11. 在函数并置操作符后,我们需要手动添加一个括号,然后将光标置于括号中。点击 If/Then/Else 菜单。在弹出窗口的第一个标签页中,点击函数菜单,开始构造 strlen 函数。


图 10. If/Then/Else 窗口
If/Then/Else 窗口

12. 构造 strlen 函数的操作步骤类似于之前构造 set 函数。完成后,在操作下拉列表中选择 >,在字符串下拉列表中选择 0。最终 If 语句的代码如下图所示


图 11. If 表达式代码
If 表达式代码

13. 接下来,开始构造 Then 表达式。进入标签页 2.Then,点击函数菜单。构造函数 viewer.messageBox(custom:results)。


图 12. Then 表达式代码
Then 表达式代码

14. 在 Then 标签页中,从操作下拉列表中选择函数并置操作符,关联函数 set('activated', 'off'),最终代码为


清单 8. Then 表达式代码
 viewer.messageBox(PAGE1.BUTTON1.custom:results)
 +.set(‘PAGE1.BUTTON1.activated’,‘off’)
 

15. 点击确定按钮,关闭 Compute 编辑器窗口。到此为止,我们的计算表达式就已经编辑好了。

通过以上操作,相信您已经能够基本掌握 Compute 编辑器的使用了。

结束语

通过阅读本文,我们可以看出引入计算功能为 XFDL 表单注入了丰富多彩的功能。本文引用了大量的实际表单代码为例,向您图文并茂地讲解了 XFDL 表单中对计算功能的支持。请您继续阅读本系列文章的第二部分,了解 XFDL 表单中对函数、事件和活动的支持。



参考资料

学习

获得产品和技术

讨论


关于作者

李旭是 SOA Designer Center 的一名软件开发工程师,主要从事 SOA Testing 工具的开发和研究。




对本文的评价










回页首


IBM 公司保留在 developerWorks 网站上发表的内容的著作权。未经IBM公司或原始作者的书面明确许可,请勿转载。如果您希望转载,请通过 提交转载请求表单 联系我们的编辑团队。
    关于 IBM 隐私条约 联系 IBM 使用条款