Print

Back to Index

Form Builder Help

Overview of Question Types

In the Form Builder, a question represents a label, which states the question or describes the requested data, and an input (also called field), which provides space for the answer.

Questions are organized in 9 different types, based on the input used:

Text Input
A text input allows a single line of text. Best for questions having a simple answer, like first name.
Text Area.
A text area allows several lines of text. Best for questions requiring longer answers, like an essay.
Checkboxes
A checkbox allows you to show a list of choices and allows any number of answers to be selected.
Radio Buttons
A radio button allows you to show a list of choices and allow only one answer to be selected. Radio buttons got their name from the old car radio, where you could push a button to select a station, and the previous selection would pop out.
Drop-down menu
Like the radio button, the drop-down menu lists a number of choices and allows only one answer to be selected. This input type is preferable when you have a long list of choices.
Menu List
Like checkboxes, a menu list allows you to display a list of choices and allow multiple answers. Note that checkboxes are usually a simple and easier to use for respondents.
File Uploads
A file upload allows respondents to select a file on their computer and attach it to the form.
Password
The password input allows a single line of text. The entry is masked.
Hidden Field
This type of input is not visible in the form and respondent cannot enter data in it. It's useful for storing tracking data that doesn't need to be edited. A hidden field type cannot be combined with other field types.

Overview of Section Types

Sections are containers which contain questions, or even other sections.

Sections provide a way to organize your form and apply a particular layout or behavior to a group of questions.

For instance, to create conditional questions, or arrange your questions across multiple columns, you would start by creating a section.

Fieldset
A fieldset visually groups related questions together, such as contact information. The fieldset has a border, and it's title (called a legend) is characteristically displayed accross the top border.
Group
A group is an invisible way to organize multiple elements on the form.
Page
You can add multiple pages to your form, which often make the form more user-friendly and organized.
Note: It is easiest to first create the page, then the fields which will be on the page.

The Editing Toolbar

The editing toolbar, also known as the floating toolbar, will appear when a field in the form in the design mode is selected.

Allowing you to style the text of the field, mark as required or delete, it is a quick way to modify your field.

There is also an Options button which will open the side bar for the field properties, such as validation and conditional rules.

For text areas, you can also postition the text or add an image.

Adding Form Fields

In the top left of the Form Builder, you can find a blue +Add Content button.

From here, you can add a variety of field types, multiple pages, text, images and other items to your form.

Adding Paragraph Text

You can add informative areas to your form by clicking +Add Content in the top left of the Form Builder, then Text & Image and text.

Adding Images

You can add images to your form by clicking +Add Content in the top left of the Form Builder, then Text & Image, then image.

Adding Contextual Help (Hints)

To add a hint to a field, select the field by clicking in the highlighted area to bring up the editing toolbar, then click on the Options button.

On the sidebar, click to expand the Contextual Help (Hint) menu.

From here, you can type the help message, choose the location of the hint and add placeholder text.

Copying Existing Content

To copy an existing field, right click in the highlighted area of a field and click Copy on the menu.

Edit the Title of your Form

To edit the title of your form, click on the form title in the preview.
On a new form, the title is Click here to enter the form title.

Enter the title you would like to show on your published form.

Note: You may want to have a separate form name for internal use, which you can modify on the Properties menu along the top toolbar.

Editing the Name of your Form

To edit the name of your form, while in the Form Builder, click Properties on the top toolbar. Then hover the mouse over Form Name, enter your prefered form name in the text box and click OK.

Selecting a Form Element for Editing

When your mouse moves over a field area, a yellow highlight will appear. If you click on the yellow area, the editing (or floating) toolbar will appear.

There are many editing option from here and for more options, click the Options button.

Editing Choices in Checkbox or Radio Inputs

Click on the field and an option will appear to add another choice.

If you would like to edit an existing choice, click on the text of the choice you would like to modify.

Deleting Choices in Checkbox or Radio Inputs

Click on the field area, then delete the text for the option you would like to delete. Once you click away from the element, the option will no longer show.

Editing Choices in Menus or Lists

Click on the field and the editing (floating) toolbar and a button will appear to edit the choices, which will also allow you to re-organize the choices.

Editing Field Hints

To edit the hint of a field, select the field by clicking in the highlighted area to bring up the editing toolbar, then click on the Options button.

On the sidebar, click to expand the Contextual Help (Hint) menu. From here, you can type the help message, choose the location of the hint and add placeholder text.

Setting a Default Value

To set a default value for a field, select the field by clicking in the highlighted area to bring up the editing toolbar then click on the options button.

On the sidebar, click to expand the Default Value menu, where you can enter a value for a text field or choose and existing option for a choice field.

Deleting Content

Click on the field and the editing toolbar will appear, which has an option to delete the element.

Reordering with Drag&Drop

Arranging your fields within the form builder can be accomplished with a simple drag and drop.

When hovering your mouse over a question, the mouse becomes a 4-directional arrow.

Left click and hold to drag the question to a different area of the form.

Reordering using the Outline

The outline of the form allows you to see and work with a larger scope of the form.

To open the outline, click on the View menu, then Outline.

To reorganize your form, you can drag&drop content within the outline.

Using Sections

Sections can be used to group fields together for functionality or appearance.

Go to the +Add Content menu and hover over Section, then click on, or drag, Fieldset or Group.

You may then drag&drop existing fields into your new section.

Adding a Page

To separate your form into multiple pages, go to the +Add Content menu and hover over 'Section', then choose Page.

The page will be added at the end of your form.

Deleting a Page

To delete a page, and all its contents, click on the page title in the preview and click the delete button on the floating toolbar.

Moving Content between Pages

When adding new content to your form, it will be added to the page you are currently viewing.

To move existing content to a different page, drag it over the desired page number at the top right of the form, or use the Outline to select and drag the element to its new location.

Understanding Predefined Content

Under the +Add Content menu, the More... option allows you to use and save commonly used questions and sections.

A number of predefined elements, such as Countries, US States and full name (US format) are available by default. This list is customizable and can include your own commonly used elements.

Adding Predefined Content

To add predefined content to your form, click on the +Add Content menu, then More... and click or drag the desired element.

Creating Pre-defined Content

Any content in your form can be added to the More... menu for future use.

If you just created a section or question that you think you will want to use later in a different form, click the element in the preview to trigger the Edit mode.

Click the Options icon in the toolbar to open the sidebar and click Add to predefined content. It is the last option at the bottom of the sidebar.

Choose a name for your new element and click Save. This element will now be availabel in the +Add Content menu.

Changing Text Colors and Styles

Colors and text font and size, along with many other options, are controlled by the theme you've selected for your form.

You can create new custom themes with our Theme Editor. To go to the Theme Editor, click the Themes menu and choose Create New....
To edit an existing theme, also click the Themes menu and choose Create New..., then Browse Themes and Modify it?.

Changing your Form's Theme

To change the theme of your form, click the Themes menu then choose from the list of default themes, or your own custom themes, if you have any.

You can create new custom themes with our Theme Editor. To go to the Theme Editor, click the Themes menu and choose Create New....

To edit an existing theme, also click the Themes menu and choose Create New..., then Browse Themes and Modify it?.

Field Label Positioning

To change the position of the label of an individual question:

  1. Select your question and then select the options button to open the sidebar.
  2. Select Presentation from the sidebar.
  3. Select your label placement preference from the Label Placement drop-down menu.

Resizing Input Boxes

To change the size of the input box for an individual question:

  1. Select your question by clicking on the input box
  2. Drag the ruler icon (on lower right corner of the input box) to the desired size.
    TIP: For finer control over the input size, press the shift key on your keyboard while resizing.

Check Box and Radio Button Layout

To change the layout of individual checkboxes and radio buttons:

  1. Select your question, then select the options button to open the sidebar.
  2. Select Presentation from the sidebar.
  3. Select your layout preference from the Choice Layout drop-down menu.

Placing Fields on the Same Line

To put multiple fields on the same horizontal line:

  1. Create a new section and place all of the fields you would like on a single line within the new section.
  2. Click on the section name, from within the Outline or within the form builder.
  3. Select the options button to open the sidebar.
  4. Select Presentation from the sidebar.
  5. Select a continuous line from the Display Content in... menu

Creating a Multi-Column Form

To create a form with a multicolumn layout:

  1. Create a new section and place all of the fields to be included within your multi-column layout within that section.
  2. Click on the section name, from within the Outline or within the form builder.
  3. Select the options button to open the sidebar.
  4. Select Presentation from the sidebar.
  5. Select the number of columns you would like for your layout from the Display Content in... menu

Creating a Likert Scale or Matrix Layout

To create Likert Scale or Matrix Layout:

  1. Create a new section and place all of the fields to be included within your matrix layout within that section.
  2. Click on the section name, either within the form builder or from within the Outline.
  3. Select the options button to open the sidebar. Or, you can select your question with the sidebar open.
  4. Select Presentation from the sidebar.
  5. Select a grid from the Display Content in... menu.

Marking a Field Required

Users can be required to fill out a given field before submitting or proceeding to a form's next page.

To set a field as required:

  1. Select your question and select the options button to open the sidebar. Or, you can select your question with the sidebar open.
  2. Select Validation Rules from the sidebar.
  3. Select the check box the reads This is a required field.

Requiring an Email Address

To require a field be filled with a valid email:

  1. Select a text input question and select the options button to open the sidebar.
  2. Select Validation Rules from the sidebar.
  3. In the Expected Input Format menu, select Email.

Requiring Numbers Only

You can require a field be filled with only a number through the following process:

  1. Select a text input question and select the options button to open the sidebar. Or, you can select your question with the sidebar open
  2. Select Validation Rules from the sidebar.
  3. In the Expected Input Format menu, select Number [0-9]

Requiring a Number within a Range

Numbers can be limited within a range by doing the following:

  1. Select a text input question and select the options button to open the sidebar.
  2. Select Validation Rules from the sidebar.
  3. In the Expected Input Format menu, select Number [0-9]
  4. Enter the lower number in the From field and the higher number in the To field.

Requiring a Date and/or Time

To require a field to accept only a date:

  1. Select a text input field and select the options button to open the sidebar.
  2. Select Validation Rules from the sidebar.
  3. In the Expected Input Format menu, select Date, Time, or Date and Time

Offer a user a calendar to select the date by selecting the Date (with calendar) option.

Requiring a Date and/or Time within a Range

Date inputs can be limited to a specific range.

To enter your range:

  1. Select a text input field and select the options button to open the sidebar.
  2. Select Validation Rules from the sidebar.
  3. In the Expected Input Format menu, select Date, Time, or Date and Time
  4. Enter your beginning date in the From field and your ending date in the To field.

Requiring a Custom Format

Create your own formatting rules by using regular expressions, creating an automatic format, or by limiting the number of characters that can be entered into a field.

  1. Select your question and select the options button to open the sidebar.
  2. Select Validation Rules from the sidebar.
  3. In the Expected Input Format menu, select Custom...
  4. Create your rules in the corresponding fields.

There are three options for your custom validation:

  • Validate with a Regular Expression
  • Auto-Format with a Mask
  • Limit Length of Input

    • We have also included a Custom validation message to help relay the expected input to your respondents.

    Validate with a Regular Expression

    Regular expressions can help you define an expected pattern.
    For instance, you would like a field to be formatted like currency.
    The regular expression ^\$[0-9]+(\.[0-9][0-9])?$ will not allow any format except $3.99 through submission.
    Example formats that will not be accepted are $3 or 3.99.
    Suggestion: Use the custom validation message to let your respondents know what is expected in the field.
    Read more on regular expressions.

    Auto-Format with a Mask

    The auto-formatting can be used for a more simple pattern, such as a phone number or serial number.
    For instance, you have a serial number field and all of the serial numbers expected to be entered on your form start with M4K, then have 4 numbers and 2 letters.
    # = numbers
    $ = alphanumeric (letters or numbers)
    So the mask would be: M4K####$$
    Characters like commas, slashes and dashes will all act like the M4K and will only act as place holders.
    The expected format willl be visible once the field is selected.

    Limit Length of Input

    This option simply allows you to set the minimum or maximum characters to be allowed in a text field. You can define one or both.

    Make a Question Conditional

    Conditional questions help simplify your form by hiding questions that are not relevant to specific answers. This is also referred to as branching or skip logic.

    Using a multiple choice question, based on the choice(s) selected, you can define when to allow other fields to show.

      1. Add a multiple choice question and another field to your form that you would like to make conditional.
      2. For the field you wish to make conditional, select then choose options on the editing toolbar.
      3. Expand the Conditional Rules menu on the sidebar.
      4. Select the question and answer to trigger the conditional logic from the drop-down menu provided on the sidebar and click Add.

    Create a Repeatable Section

    A repeatable section can help reduce the need for many fields that may not be used in each response. Contact information is a great example. Some repondents may need to add 10 contacts and some may only need to add 3. Start off with one section of contact information instead 10 sections, keeping the form simple and inviting, rather than overwhelming.

    To create a repeatable section:

      1. Group your questions within a section.
      2. Choose Repeatable Option from the sidebar.
      3. Check the corresponding box for This is a repeatable section.


    Hint: Sometimes you may find it hard to select the section and instead a field. Once you select a field and open the sidebar, there is a link at the top to "Select parent section".

    Adding Numeric Calculations to your Form

    Form fields can be computed using formulas. These formulas may refer to other questions in your form using variables. Formulas are written in Javascript and executed by the browser when filling out the form. They are defined using the Form Builder.

    Note: For formulas to function properly, javascript must be enabled in the user’s browser.

    How to define a variable

    A variable is a reference to a specific question in your web form. Its value is the answer provided by the respondent. It must be assigned to a question before it can be used in a formula.

      1. Click an existing question in the form, to show the editing toolbar.
      2. Check the Show advanced features check box if you do not see the expandable Calculations menu.
      3. Check the “This is a variable in a calculated field” box.
      4. Enter a variable name for that question. Variable names may not contain space or non-alphanumeric characters.
      5. If you selected a multiple-choice question, you must provide a value for each choice.

    To create a computed field:

      1. Click an existing question in the form, to show the editing toolbar.
      2. Check the Show advanced features check box if you do not see the expandable Calculations menu.
      3. Check the This is a calculated field check box.
      4. Enter an equation into the Formula text field.

    Previewing your Form

    You can see your form from the respondent's perspective right inside the Form Builder using the Preview option in the View menu.

    This is a great way to test your form quickly and check out features like input validation or conditional sections. When you are finished, click <<Back to Design Mode in the upper left corner of the page.

    If you would like to see it as formated for a mobile device, choose Phones or Tablets from the Target Device option, then Preview.

    Saving and Publishing your Form

    The save button is at the top right of the page. When you are ready to test your form live, click Save and leave the Form Builder.

    You can find the public link for your form in the form's Publishing tab.

    Click here for more information on publishing your form.


    Print

    Back to Index


    Open a Support Request