文档AEM as a Cloud Service用户指南

创建自适应表单 creating-an-adaptive-form-core-components

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • 主题：

创建对象：

  • undefined
  • undefined
  • undefined
版本
文章链接
AEM 6.5
单击此处
AEM as a Cloud Service
本文

自适应表单使您能够创建引人入胜、响应式、动态和自适应的表单。AEM Forms 提供便于企业用户使用的向导以快速创建自适应表单。该向导可快速地在选项卡之间导航，从而轻松地选择预先配置的模板、样式、字段和提交选项以创建自适应表单。

在开始之前，了解可使用的表单组件类型：

  • 自适应表单核心组件：这些是标准化的数据捕获组件。对于您的数字注册体验，这些组件可以提供定制功能，缩短开发时间和降低维护成本。开发人员可以轻松地自定义这些组件并设置其样式。Adobe建议使用这些现代化的、可扩展的组件来开发自适应Forms。

  • 自适应表单基础组件：这些是经典（旧版）数据捕获组件。您可以继续使用这些组件来编辑您现有的基于基础组件的自适应表单。如果创建新表单，Adobe建议使用自适应Forms核心组件创建自适应Forms。

创建自适应表单的向导

先决条件

您需要以下项来创建自适应表单：

  • 为您的环境启用自适应Forms核心组件：在创建项目时，已为您的环境启用自适应Forms核心组件。 如果您有基于 Archetype 39 或更早版本的 Forms as a Cloud Service 环境，请为您的环境启用自适应表单核心组件。在为您的环境启用核心组件时，即将​ 自适应表单（核心组件） ​模板和画布主题添加到您的环境。如果您的 AEM SDK 版本低于 2023.02.0，请确保在您的环境上启用 prerelease 标志，因为自适应表单核心组件是 2023.02.0 发布之前预发布的一部分。

  • 自适应表单模板：模板提供基本结构并定义自适应表单的外观（版面和样式）。它的预格式化的组件包含某些属性和内容结构。它还提供用于定义主题和提交操作的选项。主题定义外观，提交操作定义在提交自适应表单时执行的操作。例如，将收集到的数据发送到数据源。Cloud Service 提供一个名为 blank 的 OOTB 模板：

    • blank 模板包含在每个新的 AEM Forms as a Cloud Service 项目中。
    • 您可以通过包管理器安装参考包，以将 blank 模板添加到 AEM Forms as a Cloud Service 项目。
    • 您也可以从头开始创建自适应Forms模板（核心组件）。
    • 您还可以将示例模板部署到您的环境。 这些功能可帮助您迅速创建表单。

  • 自适应表单主题：主题包含组件和面板的样式详细信息。样式包括背景颜色、状态颜色、透明度、对齐方式和大小等属性。在应用主题时，指定的样式会反映在相应的组件上。Canvas模板包含在每个新的AEM Formsas a Cloud Service计划中。 您还可以将示例主题部署到您的环境。 这些功能可帮助您开始设计表单的样式，并提供一个基础结构，以根据业务需求创建或自定义主题。

  • 权限：将用户添加到forms-users组。forms-users组的成员具有创建自适应表单的权限。有关特定于表单的用户组的详细列表，请参阅组和权限。

创建自适应表单 create-an-adaptive-form-core-components

  1. 登录到 Experience Manager Forms 创作实例。它可以是云实例或本地开发实例。

  2. 在 Experience Manager 登录页面上输入您的凭据。登录后，在左上角选择​ Adobe Experience Manager > Forms > Forms和文档。

  3. 选择​ 创建 > 自适应Forms。 向导随即打开。在“源”选项卡中，选择一个模板：

    核心组件模板

    选择一个模板时，会自动选择该模板中指定的主题和提交操作，并启用​ 创建 ​按钮。您可以转到​ 样式 ​或​ 提交 ​选项卡以选择不同的主题或提交操作。如果所选模板未指定主题，则“创建”按钮将保持禁用状态。您可以转到​ 样式 ​选项卡以手动选择主题。

    note note
    NOTE
    如果环境中没有​ 自适应表单（核心组件） ​模板，请为您的环境启用自适应表单核心组件。在为您的环境启用核心组件时，会将​ 自适应表单（核心组件） ​模板添加到您的环境。

  4. 在​ 样式 ​选项卡中，选择一个主题：

    • 如果所选模板指定了一个主题，该主题将在向导中自动选定。您还可以从“样式”选项卡中选择其他主题。

    • 如果所选模板未指定主题，您可以使用“样式”选项卡选择主题。创建 ​按钮仅在选择主题后启用。

  5. （可选）在“数据”选项卡中，选择一个数据模型：

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

    • JSON 架构：JSON 架构我们的基于核心组件的自适应表单允许与组织的后端系统无缝集成，并能够与表示正在生成或使用的数据结构的 JSON 架构关联。利用此关联，作者可以使用架构的元素将内容动态添加到自适应表单。在创作过程中，架构的元素可在内容浏览器的数据模型对象选项卡中轻松访问，并且所有字段都会自动添加到任何创建的自适应表单中。

    默认情况下，关联的 JSON 架构的所有字段都将自动选定并转换为相应的自适应表单组件，从而简化创作过程。该向导可让您使用复选框选择性地选定应包含在自适应表单中的字段，更加方便。

  6. 在​ 提交 ​选项卡中，选择提交操作：

    • 选择一个模板时，该模板中指定的提交操作将自动选定。您可以从“提交”选项卡中选择其他提交操作。提交 ​选项卡显示所有可用的提交操作。

    • 如果所选模板未指定提交操作，您可以使用​ 提交 ​选项卡来选择提交操作

  7. （可选）在​ 交付 ​选项卡中，您可以为自适应表单指定发布或取消发布日期。

  8. 选择​ 创建。将出现一个对话框，用于指定标题、名称和位置以保存自适应表单：

    • 标题：指定表单的显示名称。标题可帮助您在 Experience Manager Forms 用户界面中标识表单。
    • 名称： ​指定表单的名称。在存储库中创建具有指定名称的节点。在开始键入标题时，名称字段的值将自动生成。您可以更改建议的值。名称字段只能包含字母数字字符、连字符和下划线。所有无效的输入都将替换为连字符。
    • 路径： ​指定用于保存自适应表单的位置。您可以直接将自适应表单保存在 /content/dam/formsanddocuments，也可以创建一个文件夹（例如 /content/dam/formsanddocuments/adaptiveforms）来保存自适应表单。确保先创建文件夹，然后再在路径中使用它。路径 ​字段不会自动创建文件夹。

  9. 选择​ 创建。自适应表单将创建并在自适应表单编辑器中打开。该编辑器显示模板中可用的内容。根据自适应表单的类型，关联 JSON架构或表单数据模型(FDM)中存在的表单元素将显示在侧边栏中​ 内容浏览器 ​的​ 数据模型对象 ​选项卡中。 您还可以拖放这些元素来生成自适应表单。

现在，您可以将自适应Forms核心组件拖放到自适应Forms容器中以设计和创建表单。 您还可以访问https://aemcomponents.dev/以查看正在运行的可用核心组件。

配置自适应表单的提交操作 configure-submit-action-for-form

提交操作让您选择通过自适应表单捕获的数据的目标。当用户单击自适应表单上的提交按钮时，会触发该事件。 自适应表单包括一些现成的提交操作。 您还可以扩展默认提交操作以创建自己的自定义提交操作。 要为表单配置提交操作，请执行以下操作：

  1. 打开内容浏览器，然后选择自适应表单的​ 指南容器 ​组件。

  2. 单击指南容器属性 指南属性 图标。这将打开“自适应表单容器”对话框。

  3. 单击​ 提交 ​选项卡。

    单击扳手图标以打开“自适应表单容器”对话框来配置提交操作

  4. 根据要求选择并配置​ 提交操作。有关提交操作的详细信息，请参阅自适应表单提交操作

将用户重定向到页面或在提交表单时显示感谢消息

在提交表单时，您可以将用户重定向到其他网页或消息。 要重定向用户或配置感谢消息，请执行以下操作：

  1. 打开内容浏览器，然后选择自适应表单的​ 指南容器 ​组件。

  2. 单击指南容器属性 指南属性 图标。这将打开“自适应表单容器”对话框。

  3. 打开​ 提交 ​选项卡。

    单击“扳手”图标以打开“自适应表单容器”对话框以配置重定向页面或感谢消息

    • 要配置重定向URL，请在提交选项中，选择​ 重定向到URL ​选项，然后浏览并选择AEM Sites页面或提供外部页面的URL。

    • 要配置自定义或感谢消息，请在“提交”选项中选择​ 显示消息 ​选项，然后在​ 消息内容 ​框中提供消息。 它是一个富文本框，您可以使用全屏选项查看所有可用的富文本项。

为自适应表单配置架构或表单数据模型(FDM) configure-schema-or-data-model-for-form

您可以使用表单数据模型(FDM)将表单连接到数据Source，以根据用户操作发送和接收数据。 您还可以将表单连接到 JSON 架构，以接收预定义格式的提交数据。根据要求，将表单连接到JSON架构或表单数据模型(FDM)：

为表单配置JSON架构或表单数据模型(FDM)

要为表单配置JSON架构或表单数据模型(FDM)，请执行以下操作：

  1. 打开内容浏览器，然后选择自适应表单的​ 指南容器 ​组件。

  2. 单击指南容器属性 指南属性 图标。这将打开“自适应表单容器”对话框。

  3. 打开​ 数据模型 ​选项卡。

    单击“扳手”图标以打开自适应表单容器对话框以配置JSON架构或表单数据模型(FDM)

  4. 根据您的要求，选择并配置JSON架构或表单数据模型(FDM)：

    • 选择​ 表单模型 ​选项时，请使用​ 选择表单数据模型 ​选项来选择预配置的表单数据模型(FDM)。
    • 选择​ 架构 ​选项时，请使用​ 架构 ​选项为您的表单选择JSON架构。

  5. 单击​ 完成。

配置预填充服务 configure-prefill-service-for-form

您可以使用预填充服务使用现有数据自动填充自适应表单的字段。 当用户打开表单时，这些字段的值会预先填充。 您可以：

使用表单数据模型预填充服务预填充自适应表单的字段 fdm-prefill-service

您可以使用表单数据模型预填充服务通过表单数据模型或自定义预填充服务预填充自适应表单的字段。 表单数据模型预填充服务使用配置的表单数据模型🔗的Get服务检索数据。 要对自适应表单使用表单数据模型预填充服务，请执行以下操作：

  1. 打开内容浏览器，然后选择自适应表单的​ 指南容器 ​组件。
  2. 单击指南容器属性 指南属性 图标。这将打开“自适应表单容器”对话框。
  3. 单击自适应表单容器属性 自适应表单容器属性 图标。 此时将打开用于配置数据模型的自适应表单容器对话框。
    单击“扳手”图标以打开“自适应表单容器”对话框以配置重定向页面或感谢消息
  4. 选择表单数据模型(FDM)。 打开​ 基本 ​选项卡。 在预填充服务中，选择​ 表单数据模型预填充服务。
  5. 单击​ 完成。 您的自适应表单现在配置为使用表单数据模型预填充。 您现在可以使用规则编辑器创建规则以预填充表单的字段。

编辑自适应表单的表单模型属性 edit-form-model

  1. 选择自适应表单，然后选择 页面信息 > 打开属性。 这将打开“表单属性”页面。

  2. 转到​ 表单模型 ​选项卡并选择表单模型。如果自适应表单没有表单模型，您可以自由选择JSON架构或表单数据模型(FDM)。 另一方面，如果自适应表单已基于一个表单模型，则可以选择切换到另一个相同类型的表单模型。例如，如果表单使用JSON架构，您可以轻松切换到另一个JSON架构，同样，如果表单使用表单数据模型(FDM)，您可以切换到另一个表单数据模型(FDM)。

  3. 选择​ 保存 ​以保存属性。

如何重命名AEM自适应表单？ rename-an-AEM-Adaptive-Form

要重命名自适应表单，请执行以下步骤：

  1. 在AEM Forms用户界面中选择自适应表单。
  2. 单击位于上边栏上的​ 属性。
  3. 在​ 标题 ​选项卡中更改表单的名称，如下图所示。
  4. 单击​ 保存并关闭。

重命名AEM自适应表单

另请参阅 see-also

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab