Skip to content

创建动态表单-Create Dynamic Forms

The Dynamic Forms module is used to capture information from site visitors on the front end. Dynamic Forms can work in combination with a Content Type or standalone. Dynamic Forms can be used to create Contact Us and Subscribe widgets/pages to name a couple. The information is then stored in Orchard and can be exported later.

动态表单模块用于从前端的站点访问者捕获信息。动态表单可以与内容类型或独立组合使用。动态表单可用于创建联系我们订阅小部件/页面来命名一对。然后将信息存储在Orchard中,以后可以导出。

Enable the Dynamic Forms Module

启用动态表单模块###

The Dynamic Forms module is different from the custom forms module because it can work in combination with a Content Type to capture input on the front-end or you can choose to just store the form submission. If you choose to just store the submission you will find it in the Form Submissions section of the admin. The information submitted is stored and can be exported using the Import-Export module. Let's start by enabling the Dynamic Forms module that is shipped with Orchard by going to the Modules section in the admin.

动态表单模块与自定义表单模块不同,因为它可以与内容类型结合使用以捕获前端的输入,或者您可以选择仅存储表单提交。如果您选择只存储提交,您可以在管理员的表单提交部分找到它。提交的信息已存储,可以使用Import-Export模块导出。让我们首先启用Orchard附带的Dynamic Forms模块,方法是转到admin中的Modules部分。

Enabling Dynamic Forms in Orchard CMS

Once the module has enabled the feature, a new content type called Form will appear in the create new content section of the admin.

模块启用该功能后,将在管理员的“创建新内容”部分中显示名为表单的新内容类型。

As stated before, the Dynamic Forms module works with a content type either create a submission or create forms on the front-end of the site. In the New content section of the admin, you can click on Form to create a new form, an edit form screen will popup allowing you to create your form. In this screen is where you can choose to either store the submission or create content from the submitted values. However, let's say we are looking to add a new widget that will live in the right rail (AsideSecond zone) that is a call for visitors to join a mailing list. The only input that will be captured will be the users email address.

如前所述,动态表单模块使用内容类型在站点的前端创建提交或创建表单。在管理员的内容部分,您可以单击表单以创建新表单,将弹出一个编辑表单屏幕,允许您创建表单。在此屏幕中,您可以选择存储提交或从提交的值创建内容。但是,假设我们正在寻找一个新的小部件,它将生活在正确的轨道(AsideSecond区域)中,这是一个访问者加入邮件列表的呼叫。将捕获的唯一输入将是用户电子邮件地址。

Store Form Submission as a Content Type

将表单提交存储为内容类型###

In order for Dynamic Forms to capture and save an email address from a visitor as Content we need to create a new content type in Orchard. In the admin, browse to the Content Definitions tab and click on Create new type button in the upper right. Let's call the new type 'Subscribe Form'.

为了使Dynamic Forms能够从访问者中捕获和保存电子邮件地址 Content ,我们需要在Orchard中创建新的内容类型。在管理员中,浏览到内容定义选项卡,然后单击右上角的创建新类型按钮。我们称之为新的“订阅表”。

Subscribe Form content type

The next screen asks if we'd like to save any Parts to the new Subscribe Form content type. Since all we are looking to capture is an email address, click on the save button without selecting any of these options. Now that we have our new content type we'll want to add an input field for the email.

下一个屏幕询问我们是否要将任何部件保存到新的订阅表单内容类型。由于我们要捕获的所有内容都是电子邮件地址,因此请单击“保存”按钮,而不选择任何这些选项。现在我们有了新的内容类型,我们想要为电子邮件添加输入字段

Subscribe Form email field

After adding and saving the input field with the name 'Email' we can now customize the type of validation the new input field should have by selecting an input type of 'Email'. Feel free to fill in the other information for the field as well.

在添加并保存名为“Email”的输入字段后,我们现在可以通过选择“电子邮件”的输入类型来自定义新输入字段应具有的验证类型。随意填写该领域的其他信息。

Subscribe Form

At this point we have all the pieces we need to create out new widget in the right rail (AsideSecond zone). We've enabled the Dynamic Forms module and we've created a new content type (Subscribe Form) that will be used to capture the email address of visitors looking to enroll in the mailing list. All that's left is to create the Widget.

在这一点上,我们拥有在右侧轨道(AsideSecond区域)中创建新小部件所需的所有部分。我们启用了 Dynamic Forms 模块,我们创建了一个新的内容类型(订阅表单),用于捕获希望注册邮件列表的访问者的电子邮件地址。剩下的就是创建Widget。

Create a Form Widget

创建一个表单小部件###

Select Widgets in the left menu of the admin and find the appropriate Add button for the AsideSecond zone and add a Form Widget.

在admin的左侧菜单中选择 Widgets ,找到AsideSecond区域的相应 Add 按钮并添加一个Form Widget。

The only thing left to do is to adjust the settings on our new Form Widget. In this example, the layer is set to 'Default' and the position is set to '1'. This will render the widget on the top of the right rail (AsideSecond zone) for all pages. In the Layout section of the form you need to add your form fields and bind it to your content type. In the layout section, see highlighted below, edit the form by dragging an Email Field field from the Layout items on the right side of the screen.

剩下要做的就是调整我们新的 Form Widget 的设置。在此示例中,[layer](Managing-widgets#AddingaLayer)设置为“Default”,位置设置为“1”。这将使窗口小部件在所有页面的右侧轨道(AsideSecond区域)的顶部呈现。在表单的“布局”部分中,您需要添加表单字段并将其绑定到您的内容类型。在布局部分,请参见下面的突出显示,通过从屏幕右侧的布局项目中拖动电子邮件字段字段来编辑表单。

Forms Widget Layout

Once it is dropped an Edit Email Field will pop up. Enter the value as shown in the screenshot below.

一旦删除,将弹出编辑电子邮件字段。输入值,如下面的屏幕截图所示。

Edit Email Field

Then click on the Validation tab and make sure to check the Required checkbox. Now you can save the form, but we are not finished yet. After you save, now we can bind the form to your content type we created earlier. Hover back over the form and click on the angle brackets. You should see the Edit Form pop up. Make sure to check the Create Content and then select your Subscribe Form from the dropdown. Now save the form.

然后单击 Validation 选项卡并确保选中 Required 复选框。现在您可以保存表单,但我们尚未完成。保存后,现在我们可以将表单绑定到我们之前创建的内容类型。将鼠标悬停在表单上并单击尖括号。你应该看到编辑表格弹出。请务必查看创建内容,然后从下拉列表中选择您的订阅表格。现在保存表单。

Bind Form To Content

Almost there, now hover on the Email Field and click the angle brackets. Click on the Bindings tab and then check the field you want to bind it to, which in our case is the Email.Text field of the Subscribe Form content type. If you do not see the bindings tab, then please save your form and go back to edit it.

几乎在那里,现在将鼠标悬停在电子邮件字段上并单击尖括号。单击 Bindings 选项卡,然后选中要绑定到的字段,在我们的示例中是 Subscribe Form 内容类型的 Email.Text 字段。如果您没有看到绑定选项卡,请保存表单并返回编辑。

Bind Email Field

These are some example settings:

这些是一些示例设置:

Dynamic Forms Widget

After saving the widget browse to a page on the site and check out the new feature!

保存小部件后浏览到网站上的页面并查看新功能!

Page view with new widget

NOTE: If the input field for the owner is visible remove it by un-checking the 'Show editor for owner' option under the Common part of the Subscribe Form content type.

注意:如果所有者的输入字段可见,则通过取消选中“订阅表单”内容类型的“公共”部分下的“为所有者显示编辑器”选项将其删除。

Common Part

Store Form Submission without a Content Type

存储没有内容类型的表单提交###

This is easy to do, all you need to do is check the Store Submission option in the form layout.

这很容易做,您只需要检查表单布局中的 Store Submission 选项。

No Content Type

View Submitted Dynamic Forms Data

查看提交的动态表单数据###

At this point, we have enabled the Dynamic Forms module, created a new content type for the Dynamic Forms to use and added a Dynamic Forms widget to draw the Subscribe Form content type in the right rail (AsideSecond zone) of all the pages. The submissions are being saved in Orchard because the option in the Dynamic Forms widget 'Create Content' was checked. So where are they being saved? Select the 'Content' link on the left in the admin section of Orchard.

此时,我们启用了动态表单模块,为动态表单创建了一个新的内容类型,并添加了一个动态表单小部件,以在所有页面的右侧轨道(AsideSecond区域)中绘制“订阅表单”内容类型。提交正在Orchard中保存,因为动态表单小部件“创建内容”中的选项已被选中。那么他们在哪里得救?选择Orchard管理部分左侧的“内容”链接。

Subscribe Form Content Type

You can view all submitted data without a content type by going to Form Submissions section in the admin.

您可以通过转到管理员中的表单提交部分来查看没有内容类型的所有提交数据。

Form Submissions

Export Dynamic Forms Data

导出动态表单数据###

Since Dynamic Forms can be either saved as a content type or as a form submissions you have different steps when exporting and importing.

由于动态表单可以保存为内容类型,也可以保存为表单提交,因此在导出和导入时会有不同的步骤。

Exporting Forms saved as Content Type

导出保存为内容类型的表单####

The only thing left to do is to export our list of submissions so that the email addresses can be used by services like Publicaster, Campaign Monitor, MailChimp and the like. The easiest way to export anything and everything from the Orchard CMS is to use the Import/Export module. The Import/Export module is shipped with Orchard by default in version 1.6 and on but is not enabled by default. Let's enable the Import/Export module.

剩下要做的唯一事情是导出我们的提交列表,以便电子邮件地址可以被Publicaster,Campaign Monitor,MailChimp等服务使用。从Orchard CMS导出任何内容和最新内容的最简单方法是使用“导入/导出”模块。默认情况下,导入/导出模块在版本1.6及更高版本中随Orchard一起提供,但默认情况下未启用。让我们启用导入/导出模块。

Import/Export module

The Import/Export functions are now available in the admin via the left navigation. Selecting the 'Export' tab at the top of the Import/Export section of the admin shows all of the available content types in Orchard. To export the list of emails that have been submitted check the box next to the Subscribe Form content type. Towards the bottom of the page there are a few options for export. The first option, Metadata, will include the definition of the content type. One use for this option would be an easy way to copy a content type and it's records from one Orchard CMS site to another. A prime example of this would be to move a new content type and data from a development site to a production site. When importing an XML file that contains both the metadata and data, Orchard will create the content type copy in the included data.

导入/导出功能现在可通过左侧导航在管理员中使用。选择管理员导入/导出部分顶部的“导出”选项卡可显示Orchard中的所有可用内容类型。要导出已提交的电子邮件列表,请选中订阅表单内容类型旁边的框。在页面底部有一些导出选项。第一个选项 Metadata 将包含内容类型的定义。此选项的一个用途是将内容类型及其记录从一个Orchard CMS站点复制到另一个Orchard CMS站点的简单方法。一个主要的例子是将新的内容类型和数据从开发站点移动到生产站点。导入包含元数据和数据的XML文件时,Orchard将在包含的数据中创建内容类型副本。

In the current situation we are only interested in exporting the data so there is no need to check the Metadata option. Also, be sure to bullet 'Draft Only' since none of the items submitted from the front end would have a published state.

在目前的情况下,我们只对导出数据感兴趣,因此无需检查元数据选项。此外,请确保弹出“仅草稿”,因为从前端提交的任何项目都不会具有已发布状态。

Export the Subscribe Form content

The exported file is and XML file that can be opened in MS Excel and manipulated to be made ready for the email campaign platform of your choice. And that's it... The site is now able to collect visitor's email addresses and save them for export later for a newsletter. The Dynamic Forms is also a great way to implement a Contact Us page or any other number of types of information a site should collect from it's users.

导出的文件是XML文件,可以在MS Excel中打开并进行操作,以便为您选择的电子邮件营销活动平台做好准备。就是这样......该网站现在能够收集访问者的电子邮件地址并保存,以便稍后导出以用于简报。动态表单也是实现“联系我们”页面或站点应从其用户收集的任何其他类型信息的好方法。

Exporting Forms saved as a Form Submission

导出表单保存为表单提交####

To export form submissions you need to enable the Dynamic Forms Import Export module.

要导出表单提交,您需要启用动态表单导入导出模块。

Forms Import Export Module

Once enabled, now when you perform an export, you need to enable the custom step called "Forms" to export your Form Submissions

启用后,现在执行导出时,需要启用名为“表单”的自定义步骤以导出表单提交

Exporting Form Submissions