自适应表单和HTML5表单的外观框架

Forms（自适应表单和HTML5表单）使用jQuery、Backbone.js和下划线。js库进行外观和脚本编写。 表单还将jQuery UI 构件​体系结构用于表单中的所有交互元素（如字段和按钮）。 此体系结构使表单开发人员能够使用Forms的丰富的可用jQuery构件和插件。 您还可以在从用户（如leadDigits/trailDigits限制或实施图片子句）捕获数据时实现表单特定逻辑。 表单开发人员可以创建和使用自定义外观来改进数据捕获体验，并使其更易用。

本文面向对jQuery和jQuery构件有充分认识的开发人员。 它提供对外观框架的洞察，使开发人员能为表单字段创建替代外观。

外观框架依赖各种选项、事件（触发器）和函数来捕获用户与表单的交互，并响应模型更改以通知最终用户。 此外：

  • 框架提供一组用于字段外观的选项。 这些选项是键值对，并分为两个类别:常用选项和字段类型特定选项。
  • 外观作为合同的一部分会触发一组事件，如进入和退出。
  • 要实现一组函数，外观是必需的。 有些函数是常用的，而有些函数是特定于字段类型函数的。

常用选项

以下是设置全局选项。 这些选项适用于每个字段。

属性 描述
name 用于在脚本表达式中指定此对象或事件的标识符。 例如，此属性指定主机应用程序的名称。
选定 字段的实际值。
displayValue 将显示该字段的此值。
screenReaderText 屏幕Reader使用此值来解说有关字段的信息。 表单提供值，您可以覆盖该值。
tabIndex 字段在表单的选项卡序列中的位置。 仅当要更改表单的默认制表符顺序时，才覆盖tabIndex。
角色 元素的角色，例如“标题”或“表”。
高度 构件的高度。 它以像素为单位指定。
宽度 构件的宽度。 它以像素为单位指定。
访问 用于访问容器对象（如子表单）内容的控件。
paraStyles XFA元素对构件的para属性。
dir 文本的方向。 可能的值为ltr（从左到右）和rtl（从右到左）。

除了这些选项，框架还提供了一些其他选项，这些选项因字段类型而异。 下面列出了特定于字段的选项的详细信息。

与表单框架的交互

要与表单框架交互，构件会触发一些事件，使表单脚本能够工作。 如果构件未抛出这些事件，则为该字段在表单中编写的某些脚本将不起作用。

事件由构件触发

事件 描述
XFA_ENTER_事件 只要字段处于焦点，就会触发此事件。 它允许在字段上运行“enter”脚本。 用于触发事件的语法为
（构件）。_trigger(xfalib.ut.XfaUtil.prototype.XFA_ENTER_事件)
XFA_EXIT_事件 当用户离开字段时，将触发此事件。 它允许引擎设置字段的值并运行其“exit”脚本。 用于触发事件的语法为
（构件）。_trigger(xfalib.ut.XfaUtil.prototype.XFA_EXIT_事件)
XFA_CHANGE_事件 触发此事件以允许引擎运行写入字段的“change”脚本。 用于触发事件的语法为
（构件）。_trigger(xfalib.ut.XfaUtil.prototype.XFA_CHANGE_事件)
XFA_CLICK_事件 单击字段时将触发此事件。 它允许引擎运行写入字段的“click”脚本。 用于触发事件的语法为
（构件）。_trigger(xfalib.ut.XfaUtil.prototype.XFA_CLICK_事件)

由构件实现的API

外观框架调用构件的某些功能，这些功能在自定义构件中实现。 构件必须实现以下功能：

函数 描述
焦点：function() 专注于现场。
单击：function() 将焦点放在字段上并调用XFA_CLICK_事件。

markError:function(errorMessage, errorType)

errMessage:表示error
errorType的字符串:字符串("warning"/"error")

注意:仅适用于HTML5表单。

 向构件发送错误消息和错误类型。 构件显示错误。

clearError:function()

注意:仅适用于HTML5表单。

 如果字段中的错误已修复，则调用。 构件会隐藏错误。

特定于字段类型的选项

所有自定义构件均应符合上述规范。 要使用不同字段的功能，构件必须符合该特定字段的准则。

文本编辑：文本字段

选项 描述
多线 如果字段支持输入换行符，则返回true；否则返回false。
maxChars 可在字段中输入的最大字符数。

limitLengthToVisibleArea

注意:仅适用于HTML5表单

 指定当文本宽度超过构件宽度时文本字段的行为。

ChoiceList:DropDownList, ListBox

选项 描述
选定
 所选值的数组。
项目
 要作为选项显示的对象的数组。 每个对象都包含两个属性-
save:要保存的值，请显示：要显示的值。

可编辑

注意:仅适用于HTML5表单。

 如果值为true，则构件中将启用自定义文本条目。
displayValue
 要显示的值的数组。
多选
 如果允许多个选择，则为true，否则为false。

API

函数 描述

addItem: function(itemValues)
itemValues:对象，其中包含显示并保存值
{sDisplayVal:<displayValue>, sSaveVal:<save value>}

 向列表添加项目。
deleteItem:function(nIndex)
nIndex:要从列表


中删除的项的索引 		从列表中删除选项。
clearItems: function() 从列表中清除所有选项。

数字编辑：NumericField, DecimalField

选项 描述
dataType 表示字段的数据类型（整数／十进制）的字符串。
leadDigits 十进制数中允许的最大前导位数。
fracDigits 十进制数中允许的最大分数位数。
零 字段区域设置中零的字符串表示。
小数 字段区域设置中小数的字符串表示法。

CheckButton:RadioButton, CheckBox

选项 描述
values

值的数组（开／关/中性）。

它是checkButton不同状态的值数组。 值[0]是状态为ON时的值，值[1]是状态为OFF时的值，
值[2]是状态为NETRAL时的值。 值数组的长度等于状态选项的值。
州

允许的状态数。

两个用于自适应表单（开、关），三个用于HTML5表单（开、关、中性）。
状态

元素的当前状态。

两个用于自适应表单（开、关），三个用于HTML5表单（开、关、中性）。

DateTimeEdit:(DateField)

选项 描述
天 该字段的本地化天数名称。
个月 该字段的本地化月份名称。
零 数字0的本地化文本。
clearText 清除按钮的本地化文本。

On this page

Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now