Related Content
Tags
Modules
UGC

Form Builder

Posted by Joel Varty on March 12, 2013
0 people like this tutorial
Rate:

The Form Builder feature allows you define and place submission forms on your website without needing any developer tools or code.  You define the form fields in a User Content Definition, and then decide whether to have the submission saved in User Content, or sent to the email addresses of your choice.  Once the form is submitted, you can show a templated message, or redirect to another page.  You can customize the look and feel of the form itself, the email, and the validation message.

Let's see how it works.

One of the best examples of this is a "Contact Us" form. 

The first thing you do is add a "Form" module to whatever page you are on.

 

Now you can either use an existing User Content Definition or create a new one.  This process is documented here - although it's important to note the new option to "Enable Publishing Workflow" on User Content definitions, which is disabled by default on definitions created from Form Submission.  This option is important because it means the submitted data will not be made available on the website, and can't be published.


 

For this form, I've already got a "Contact Submission" definition prepared, and I could edit it from here if I needed to.  I've opted to send the submission as an email, and have it saved to User Content.  I could also include a "Captcha" at the bottom of the form, but for these submissions I'm more concerned about user experience than spam or bots. 

If you need to customize the look and feel of the form, I would select "Use Customized Form", which allows me to edit the HTML that will be used for the form.  This is plain old HTML, nothing fancy, but be mindful that you don't change any name or class attributes, as the underlying logic uses this to submit the data.  If you don't want a field to appear on the form, such as something used only for your internal processes, you can remove it or hide it in CSS.

 

The email tab lets you customize the to address, from address, subject and body of the email.  Any field from the User Content definition can be inserted into the subject or body using the ##FieldName## syntax.

 

There are 2 ways to respond to to the submission: a confirmation message, or a redirect URL.  The confirmation message will show without changing the browser's address bar, and you can template that message with fields from the User Content definition, too.

The final thing to setup is the Error Template, which is simply a message that the user will see on the website if they haven't filled the required fields out, or if there was a problem with the submission.

Above is the submission form with a few fields filled out, and you'll notice the email field has been validated.  This uses the validation expression and message on the User Content definition field.

Once the data has been submitted, it will show up in the User Content section, which has a section for Form Submissions.

 

 

The submitted data shows up just like any other data in User Content, except the status is now "Submitted".

 

 

There are tons of uses for this feature on your website!

 

Add a Comment

   
  
 
 
   
Submit

LOGIN

Log in with your Agility username and password or
register for the site




Log In

REGISTER












Register

FORGOT PASSWORD