The following example shows how to create a single form to collect contact information from a visitor (name, email, and additional optional information). It uses the following form elements: Text, Number, Text area, Hidden visitor profiling, Hidden predefined value, Reset button, and Submit button.
You can watch the following demonstration video, Demo of an email form. (5:20 minutes)
- From the Assets pane, select the Forms tab. (Existing forms appear with their associated folders.)
- From a folder's context menu, select New Form and give it a name such as E-mail sign up.
- Drag form elements onto the new form. The following image shows unedited elements for the Email sign up form.
- Select Edit from an element's context menu. The form element's specification screen appears.
- Change the elements as follows (add your own Placeholder text) and publish each element:
- Text. Rename to First Name with Required checked.
- Text. Rename to Last Name with Required checked.
- Text. Rename to Email Address with Required and Email checked.
- Number. Rename to Phone number with Positive Integer checked.
- Text area. Rename to Comments.
- Hidden visitor profiling. Select Geo: Region Code.
- Hidden predefined value. Enter Campaign-123 in Predefined value.
- Reset button. Rename to Clear.
- Submit button. Rename to Submit Form.
The E-mail sign up form should look something like the following image:
- Publish the form container. It appears in your Forms list.
- Place the block on a web page and publish the page.
Test your form
To test your form, enter data into the form on the page in View mode and click Submit Form. When you submit the data, it is stored in the Episerver Dynamic Data Store (DDSDynamic Data Store; a component offering an API and infrastructure for the saving, loading and searching of compile-time data types (.NET object instances) and runtime data types (property bags). The component is shipped as part of the Episerver Framework package.) .
To view the results of your test, go to your E-mail sign up form block and select Form submissions from the menu. (You also can open the Select view menu and select Form submissions.)
The Form submissions view appears with data submitted from the form.
You can export form data to XML, CSV, or JSON formats.