表单容器组件

核心组件表单容器组件允许创建简单的提交表单。

使用

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

通过使用配置对话框,内容编辑器可以定义由表单提交触发的操作、应处理提交的URl以及是否应触发工作流。 模板作者可以使用设计对话框定义允许的组件及其映射,该对话框类似于模板编辑器](https://docs.adobe.com/content/help/zh-Hans/experience-manager-cloud-service/sites/authoring/features/templates.html)中[标准布局容器的设计对话框。

注意

表单容器组件核心组件仅支持使用核心组件表单组件(按钮、文本、隐藏等)。 不支持在核心组件中使用基础组件表单组件容器(反之亦然)。

版本和兼容性

表单容器组件的当前版本为v2,2018年1月随核心组件版本2.0.0一起推出,本文档对此进行了说明。

下表详细列出了组件的所有受支持版本、与组件版本兼容的AEM版本以及指向先前版本文档的链接。

组件版本 AEM 6.4 AEM 6.5 AEM as a Cloud Service
v2 兼容 兼容 兼容
v1 兼容 兼容 -

有关核心组件版本和版本的详细信息,请参阅文档核心组件版本

示例组件输出

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

技术详细信息

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

有关开发核心组件的更多详细信息,请参阅核心组件开发人员文档

配置对话框

配置对话框允许内容作者定义提交组件时要执行的操作。

根据所选​操作类型,容器中的可用选项将发生变化。 可用的操作类型有:

无论类型如何,都有常规设置适用于每个操作。

发布表单数据

提交表单后,提交的表单数据操作类型会将提交的数据作为JSON传递给第三方以进行处理。

在表单容器组件的编辑对话框中发布表单数据选项

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

系统管理员可以调整其他超时选项来处理转发的表单数据。 有关详细信息,请参阅GitHub上的技术文档。

邮件

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

表单容器组件编辑对话框中的邮件选项

  • 主题 -提交表单时将发送的电子邮件的主题
  • 发件人 -提交表单时将发送的电子邮件的发件人电子邮件地址
  • 收件人 -提交表单后将收到电子邮件的收件人的地址
    • 点按或单击​添加​按钮以添加其他地址
    • 点按或单击​删除​按钮以删除电子邮件地址
  • CC —— 收到提交表单时发送的电子邮件的碳副本的收件人的地址
    • 点按或单击​添加​按钮以添加其他地址
    • 点按或单击​删除​按钮以删除电子邮件地址

存储内容

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

在表单容器的编辑对话框中存储内容选项

  • 内容路径 -存储已提交内容的内容存储库路径
  • 视图数据 -点按或单击以将存储的提交数据视图为JSON
  • 开始工作流 -配置以在提交表单时将存储的内容作为有效负荷开始工作流
注意

为了简化用户数据管理并强制分散关注点,一般不建议在存储库中存储用户生成的内容。

而应使用发布表单数据操作类型将用户内容传递到专用服务提供商。

常规设置

无论选择何种操作类型,始终都可以定义感谢页面。

表单容器组件编辑对话框中的常规选项

  • 感谢页面 -表单提交完成后,用户将被重定向到指定页面。
    • 使用选择对话框选择AEM中的资源。
    • 如果感谢页面不在AEM中,请指定绝对URL。 非绝对URL将被解释为相对于AEM。
    • 留空可在提交后重新显示表单。
  • ID —— 此选项允许控制HTML和数据层中组件的唯一标 识符
    • 如果留空,则会自动为您生成唯一ID,并可通过检查生成的页面找到该ID。
    • 如果指定了ID,则作者有责任确保它是唯一的。
    • 更改ID可能会影响CSS、JS和数据层跟踪。

设计对话框

设计对话框允许模板作者为容器定义允许的组件及其映射,该映射类似于模板编辑器](https://docs.adobe.com/content/help/zh-Hans/experience-manager-cloud-service/sites/authoring/features/templates.html)中[标准布局容器的设计对话框。

样式选项卡

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

在此页面上