自适应表单创作简介

概述

自适应表单允许您创建有吸引力、响应式、动态和自适应的Forms。 AEM Forms为创建和使用自适应表单提供了直观的用户界面和现成的组件。 您可以选择基于表单模型或架构创建自适应表单，也可以选择不使用表单模型。 请务必仔细选择不仅符合您的要求，而且可扩展现有基础设施投资和资产的表单模型。您可以从以下选项中进行选择以创建自适应表单：

• 使用表单数据模型
  数据集成 允许您将来自不同数据源的实体和服务集成到可用于创建自适应表单的表单数据模型。 如果您创建的自适应表单涉及从多个数据源获取数据以及将数据写入多个数据源，请选择表单数据模型。

• 使用 XDP 表单模板
  如果您投资于基于 XFA 的表单或 XDP 表单，那么这将是理想的表单模型。它提供了一种将您的基于XFA的表单转换为自适应表单的直接方法。 任何现有的XFA规则都会保留在关联的自适应表单中。 生成的自适应表单支持XFA构造，例如验证、事件、属性和模式。

• 使用 XML 架构定义 (XSD) 或 JSON 架构
  XML 和 JSON 架构代表组织中的后端系统在其中生成或使用数据的结构。您可以将架构关联到自适应表单，并使用其元素将动态内容添加到自适应表单。 在创作自适应表单时，架构的元素可用于内容浏览器的数据模型对象选项卡。

• 不使用或不使用表单模型
  使用此选项创建的自适应表单不使用任何表单模型。 从此类表单生成的数据 XML 具有带字段和相应值的平面结构。

有关创建自适应表单的更多信息，请参阅 创建自适应表单.

自适应表单创作UI

用于创作自适应表单的触屏优化UI非常直观，并提供：

• 拖放功能
• 标准表单组件
• 集成的资产存储库

创建新自适应表单或编辑现有自适应表单时，将使用以下UI元素：

• 侧栏
• 页面工具栏
• 组件工具栏
• 自适应表单页面

答： 侧栏 B. 页面工具栏 C. 自适应表单页面

侧栏

侧栏可让您：

• 查看面板、组件、字段和布局等表单内容。
• 编辑组件属性。
• 在您的 AEM 数字资产管理 (DAM) 存储库中搜索、查看和使用资产。
• 在表单上添加组件。

A. 内容浏览器 B. 属性浏览器 C. 资产浏览器 D. 组件浏览器

侧栏包含以下浏览器：

• 内容浏览器
  在内容浏览器中，您可以看到

  • 表单对象
    显示表单的对象层级。作者可以通过在表单对象树中点按特定表单组件来导航到该组件。作者可以从该树中搜索对象并重新排列它们。

  • 数据模型对象
    可让您查看表单模型层级。
    它允许您在自适应表单上拖放表单模型元素。 已添加的元素会自动转换为表单组件，同时保留其原始属性。当表单使用 XML 架构、JSON 架构或 XDP 模板时，您会看到数据模型对象。

• 属性浏览器

  可让您编辑组件的属性。属性根据组件而变化。要查看自适应表单容器的属性，请执行以下操作：

  选择一个组件，然后点按 > 自适应表单容器，然后点按 .

• 资产浏览器

  使不同类型的内容分离开来，例如图像、文档、页面、电影等。

• 组件浏览器

  包含可用于构建自适应表单的组件。 您可以将组件从拖动到自适应表单上以添加表单元素，并根据需要配置添加的元素。 下表描述了组件浏览器中列出的组件。

使用组件的最佳实践

使用自适应表单组件时应记住的一些最佳实践和要点如下：

• 每个组件都具有控制其外观和功能的关联属性。 要配置组件的属性，请点按该组件并点按 以在“属性”浏览器中打开组件属性。

• 组件由其元素名称标识。 当您点按 ，您可以通过更改组件名称来更改组件 元素名称 属性浏览器中的字段值。 元素名称字段仅接受字母、数字、连字符(-)和下划线(_)。 不允许使用其他特殊字符，元素名称应以字母开头。

• 只要标题在表单上可见，您就可以在表单编辑器中内联修改自适应表单组件的“标题”属性，而无需打开“属性”浏览器。 为此，请执行以下操作：

  1. 点按以选择具有 标题 物业及其他 隐藏标题 属性已禁用。

  2. 点按 以使标题可编辑。

  3. 修改标题并点按Return键，或点按组件之外的任意位置以保存更改。 点按Esc键可放弃更改。

• 一些自适应表单组件（如电子邮件和电话）包含现成的验证模式。 但是，您可以通过更新 验证模式 组件属性中模式折叠面板下的字段。 有关默认验证的更多信息，请参阅上表中的组件说明。

• 自适应表单字段（如数字框和电子邮件）可以配置为包含专门的HTML5输入类型。 当这些字段重点关注移动设备和平板电脑时，键盘会预先显示特定字母、数字和字符，这些通常用于输入字段中的信息。 它有助于用户快速输入信息，而无需在键盘上的字符集之间进行切换。 要允许对组件进行专门化的输入，请启用 使用HTML类型编号 复选框。

• 您可以启用文本框组件以接受富文本。要为文本框启用富文本，请启用 允许富文本 复选框。

• 您可以启用文本框、电子邮件和电话组件，以自动填写名称、地址、信用卡、电话和电子邮件等字段的值，这些字段的值来自浏览器自动填写设置中存储的信息。 要启用此功能，请选择 启用自动填写 在组件属性中，选择 自动填写属性. 当用户填写自适应表单时，会根据浏览器中的自动填写配置文件或用户之前填写的值来建议这些值。 请注意，如果打开了用户浏览器中的自动填写设置，则自动填写可正常工作。

• 在中指定单选按钮和复选框项目的值 {value}={text} 组件属性中的格式。

• 默认情况下，文件附件组件仅允许用户附加一个文件。 但是，您可以配置组件属性以支持多个附件。 此外，如果用户使用相同的文件名附加多个文件，则附件可能会导致一些问题。 因此，建议在提交表单时为每个提交的附件设置一个唯一标识符。 为此，请执行以下操作：

  1. 在AEM Forms服务器上，导航到 Adobe Experience Manager > 工具 > 操作 > Web控制台.
  2. 查找并点按 自适应Forms配置服务.
  3. 在“自适应Forms配置服务”对话框中，启用 使文件名唯一. 默认情况下，该选项处于禁用状态。

• 要使用户能够使用Safari浏览器附加PDF，请确保 application/pdf 添加到文件附件组件的“支持的文件类型”属性中。 使用以前的AEM Forms版本创建的自适应表单可能包含 .pdf 而不是 application/pdf 在“支持的文件类型”属性中。

有关自适应表单的更多最佳实践，请参阅 使用自适应表单的最佳实践.

页面工具栏

顶部的页面工具栏提供了各种选项，以便您能够预览表单、更改表单属性和编辑表单布局。您可以在创作表单时预览表单，并进行相应的更改。在页面工具栏中，您会看到：

• 切换侧面板：可让您显示或隐藏侧栏。

• 页面信息：可让您查看页面属性、发布/取消发布表单、启动表单工作流以及在经典 UI 中打开表单。

• 模拟器：可让您针对不同的显示尺寸（如平板电脑和手机）模拟表单外观。

• 编辑：可让您选择其他模式，例如：编辑、样式、开发人员​和​设计。

  • Edit：可让您编辑表单及其组件的属性。例如，添加组件、删除图像和指定必填字段。

  • 样式：可让您设计表单组件的外观。例如，在样式模式下，您可以选择一个面板并指定其背景颜色。

  • 开发人员：可让开发人员：

    • 发现表单的组成部分。
    • 调试何时何地发生的情况，这反过来有助于解决问题。

  • 设计。可让您启用或禁用自定义组件，或侧栏中未列出的现成组件。

• 预览：可让您预览表单在发布时的外观。

组件工具栏

在选择一个组件时，将显示一个可用于使用该组件的工具栏。您可以获得用于剪切、粘贴、移动和指定组件属性的选项。您的选项包括：

A. 配置：在点按​配置​时，组件属性将显示在侧栏中。通过配置这些属性，您可以自定义数据捕获体验。您可以更改组件的元素名称，在组件的“标题”字段中指定标签文本。利用元素名称，可以捕获用户使用组件输入的值。在组件属性中，可以指定组件的行为，并管理用户输入。在侧栏中配置属性以捕获用户数据并将它用于进一步处理。自适应表单容器的属性允许您指定客户端库、布局、主题、记录文档设置、保存设置、提交设置和元数据设置。

B. 复制：可以使用复制选项来复制一个组件并将其粘贴到表格中的其他位置。粘贴组件时，粘贴的组件将获得一个新的元素名称，但保留已复制组件的属性。

C.剪切：可使用“剪切”选项在自适应表单中将组件从一个位置移动到另一个位置。

D. 删除：可让您从表单中删除组件。

E. 插入：可让您在选定组件的上方插入组件。

F. 粘贴：可让您粘贴使用上述选项剪切或复制的组件。

G. 编辑规则：可让您打开规则编辑器。有关更多信息，请参阅 规则编辑器.

H. 分组：可让您选择多个组件（如果要剪切、复制或粘贴多个组件）。

I 父项：可让您选择组件的父项。例如，文本字段位于子分区中，后者位于分区中。部分位于指南根面板中，而自适应表单容器是指南根面板的父级。 对于组件，您会看到层级自下而上排序的所有选项。

例如，如果您点按文本框的​父项，则会看到：

• 子分区
• 分区
• guideRootPanel
• 自适应表单容器

J. 其他：提供更多选项来处理所选组件。

• 查看 SOM 表达式
• 将面板另存为片段（仅适用于面板）
• 添加子面板（仅适用于面板）
• 添加面板工具栏（仅适用于面板）
• 替换（不适用于面板）

自适应表单页面

自适应表单页面是实际表单。 它类似于任何其他建模为 WCM cq:Page 组件的 WCM 页面。下图显示了典型自适应表单的内容结构。

内容结构通常包含以下主要组件：

• guideContainer：自适应表单的根，标记为 自适应表单的开头 在自适应表单UI中。 在此组件中，您可以指定：

  • 自适应表单的移动布局：定义表单在移动设备上的外观。
  • 感谢页面：定义用户在提交表单后被重定向到的页面。
  • 提交操作：定义用户提交表单后在服务器上处理表单的方式。
  • 样式：指定用于自定义表单外观的 CSS 文件的路径。

• 根面板： 自适应表单的根面板。 它可以包含项目节点下的子面板。每个包含根面板的面板都可以有一个与之关联的布局。面板的布局指示表单的布局方式。例如，在折叠布局中，其项目被布置为折叠步骤。

• 工具栏： 自适应表单容器具有关联的全局工具栏，该工具栏对表单是全局的。 可以使用编辑栏中的​添加工具栏​操作来添加此工具栏，这可让作者添加操作，例如提交、保存、重置等。

• 资产：​此节点包含用于表单创作的附加信息。例如，表单模型详细信息、本地化详细信息等)。

Business.Adobe.com 资源

Cms Cloud Content Intelligence Responsive Forms Document Generation Content Management Headless Cms