表单容器组件

利用核心组件表单容器组件，可以创建简单提交表单。

用途

利用表单容器组件，可支持简单的 WCM 表单并使用嵌套结构来允许其他表单组件，从而构建简单信息提交表单和功能。

通过使用“配置”对话框，内容编辑者可以定义由表单提交触发的操作、将处理提交的 URl 以及是否应触发工作流。模板作者可使用“设计”对话框定义允许的组件及其映射，这与模板编辑器中的标准布局容器的“设计”对话框类似。

版本和兼容性

表单容器组件的当前版本是 v2，此版本随 2018 年 1 月的核心组件 2.0.0 版的发布引入，具体说明见本文。

下表详细说明了该组件的所有受支持版本、与该组件的版本兼容的 AEM 版本以及指向早期版本文档的链接。

有关核心组件版本的更多信息，请参阅文档核心组件版本。

示例组件输出

要体验表单容器组件并查看其配置选项示例以及 HTML 和 JSON 输出，请访问组件库。

技术详细信息

在 GitHub 上可找到有关表单容器组件的最新技术文档。

在核心组件开发人员文档中可找到有关开发核心组件的其他详细信息。

“配置”对话框

利用“配置”对话框，内容作者可以定义在提交组件时执行的操作。

容器中的可用选项因选定的​操作类型​而异。可用的操作类型为：

• 发布表单数据
• 邮件
• 存储内容

不管类型如何，都有适用于每种操作的常规设置。

发布表单数据

在提交表单时，发布表单数据操作类型会将提交的数据作为 JSON 传递给第三方以供处理。

• 端点 - 将处理数据的完全限定的 HTTPS 服务
• 错误消息 - 提交失败时显示的消息

邮件

在提交表单时，邮件操作类型将向指定收件人发送电子邮件。

• 主题 - 在提交表单时将发送的电子邮件的主题
• 发件人 - 在提交表单时将发送的电子邮件的发件人电子邮件地址
• 收件人 - 在提交表单时将接收电子邮件的收件人的电子邮件地址
  • 点击或单击​“添加”​按钮可添加其他地址
  • 点击或单击​“删除”​按钮可删除电子邮件地址
• 抄送 - 将接收在提交表单时发送的电子邮件的副本的收件人地址
  • 点击或单击​“添加”​按钮可添加其他地址
  • 点击或单击​“删除”​按钮可删除电子邮件地址

存储内容

在提交表单时，表单内容将存储在指定的存储库位置。

• 内容路径 - 用于存储所提交内容的内容存储库路径
• 查看数据 - 点击或单击此项可查看以 JSON 格式存储的已提交数据
• 启动工作流 - 配置此项可在提交表单时启动工作流并将存储的内容作为有效负载

常规设置

无论选择的操作类型如何，始终能定义感谢页面。

• 感谢页面 - 在提交完表单后，用户将被重定向到指定的页面。
  • 使用“选择”对话框可在 AEM 中选择资源。
  • 如果感谢页面未在 AEM 中，请指定绝对 URL。非绝对 URL 将解释为相对于 AEM。
  • 留空可在提交后重新显示表单。
• ID - 利用此选项，可以控制 HTML 和 Data Layer 中的组件的唯一标识符。
  • 如果留空，系统会自动为您生成一个唯一 ID，可以通过检查结果页面找到该 ID。
  • 如果指定一个 ID，作者有责任确保它是唯一的。
  • 更改此 ID 会对 CSS、JS 和 Data Layer 跟踪产生影响。

“设计”对话框

利用“设计”对话框，模板作者可为容器定义允许的组件及其映射，这与模板编辑器中的标准布局容器的“设计”对话框类似。

“样式”选项卡

表单容器组件支持 AEM 样式系统。