51黑料不打烊

使用 Adaptive Forms Block 创建表单

video poster

AEM Forms Edge Delivery 提供了一个称为 Adaptive Forms Block 的区块,可帮助您轻松创建表单,以捕获和存储捕获的数据。您可以创建一个预先配置了 Adaptive Forms Block 的新 AEM 项目将 Adaptive Forms Block 添加到现有的 AEM 项目

这些表单可将数据直接提交到 Microsoft Excel 或 Google Sheets 文件,使您能够使用 Google Sheets、Microsoft Excel 和 Microsoft SharePoint 充满活力的生态系统和强大的 API 来轻松处理提交的数据或启动现有的业务工作流程。

基于文档的创作生态系统

先决条件

在开始之前,请确保您已完成以下步骤:

  • 确保您有权访问 Google Sheets 或 Microsoft SharePoint。要将 Microsoft SharePoint 设置为您的内容源,请参阅

创建表单

步骤 1:使用 Microsoft Excel 或 Google Sheet 创建表单。

使用电子表格可以轻松地制作表单,而无需执行复杂的流程。您可以定义构成表单结构的行和列。每行代表一个单独的表单字段,列标题定义相应的字段属性

例如,请考虑以下电子表格,其中行标题概述了 “别苍辩耻颈谤测” 电子表格的字段,列标题则定义其属性:

“Enquiry” 电子表格

要继续创建表单:

  1. 访问 Microsoft SharePoint 或 Google Drive 上的 AEM Edge Delivery 项目文件夹。

  2. 在 AEM Edge Delivery 项目目录中的任意位置创建一份 Microsoft Excel 工作簿或 Google 工作表。例如,在 Google Drive 上的 AEM Edge Delivery 项目目录中创建一个名为 enquiry 的电子表格。

  3. 确保根据为项目指定的配置,与适当的 AEM 用户(例如 forms@adobe.com)。授予用户编辑表的权限。

  4. 打开创建的电子表格并将默认表重命名为 “shared-aem”。

    将默认工作表重命名为 “shared-default”

  5. 要添加表单字段,请将行和列标题插入 “shared-aem” 表中。每行应该代表一个表单字段,列标题定义相应的字段属性

    为了快速开始,请考虑复制 “别苍辩耻颈谤测” 电子表格中的内容到电子表格中。复制内容后,保存电子表格。

    embed

    video poster

  6. 使用 预览表。

    使用 AEM Sidekick 预览表

    预览时,新的浏览器选项卡会以 JSON 格式显示工作表的内容。确保捕获预览 URL,因为这是在下一节中渲染表单所必需的。URL 格式如下所示:

    code language-json
        https://<branch>--<repository>--<owner>.aem.live/<form-path>/<form-file-name>.json
    
    • <branch> 指 GitHub 存储库的分支。
    • <repository> 表示您的 GitHub 存储库。
    • <owner> 指托管您 GitHub 存储库的 GitHub 帐户用户名。

    例如,如果您的项目存储库名为 “wefinance” 且位于帐户 “wkndform” 下,并且您使用的是 “main” 分支,则 URL 如下所示:

https://main--wefinance--wkndform.aem.page/enquiry.json
&#虫3颁;!–(丑迟迟辫蝉://尘补颈苍–飞别蹿颈苍补苍肠别–飞办苍诲蹿辞谤尘.补别尘.辫补驳别/别苍辩耻颈谤测.箩蝉辞苍)–>

步骤2:使用Edge Delivery Services页面预览表单。

到目前为止,您已经准备好了表单的结构。现在,要预览表单,请执行以下操作:

  1. 打开您的 Microsoft SharePoint 或 Google Drive 帐户,并导航至 AEM Edge Delivery 项目目录。

  2. 打开文档文件(例如索引文件)以嵌入表单。或者,您可以创建一个新文档

  3. 移至文档中要添加表单的所需位置。

  4. 创建表单区块来呈现表单。选择“插入”>“表格”,然后创建一个一列两行的表格。将表命名为“表单”并将预览 URL 粘贴到第二行中。确保 URL 的格式为超链接,而不是纯文本,如下所示:

    table 0-row-1 1-row-1
    表单
    https://main--wefinance--wkndform.aem.live/enquiry.json

    将 Adaptive Forms Block 添加到您的网页

    该区块用作嵌入表单的占位符。在该区块的第二行中,添加 <form>.json 文件的预览 URL 作为超链接。

    note important
    IMPORTANT
    确保 URL 的格式为超链接,而不是显示为纯文本。
  5. 使用 预览文档。页面现在显示表单。例如,以下是基于 “别苍辩耻颈谤测” 电子表格的表单:

    EDS 表单样本

    现在,填写该表单并单击提交按钮,您会遇到类似于以下内容的错误,因为该电子表格尚未设置为接受数据。

    表单提交错误

下一步

准备您的电子表格以在表单提交后开始接受数据。

另请参阅

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