Web Form Elements

You are here

What can you do with form elements?

Common features in form elements

web elements

Display: Nearly all form elements allow you to determine display parameters like size and the placement of labels for the element.

Validation: Nearly all form elements feature validation rules, which can be used to require the user to enter or select data, and to set limits around what type of data may be entered or selected. CSS styling can also be applied to both the form and any elements that gather input from users.

Conditionals: Conditional rules may be set for form elements. Conditionals may be used to hide or show certain form elements (or entire pages!) based on the value of other elements. For example, you may choose not to display a question based on the answer to a previous question. Conditionals may also be used to set some elements to a certain value depending on how a previous question was answered.

Text Field
Optional Prefix text Optional Suffix text
A text field can gather any alphanumeric or special characters. The largest size permissible for the box itself is shown. The number of characters accepted can range from 1 to 9999,999. It can be made a required field, and it may also be required that all entered values for this field are unique, i.e. he same value is not allowed to be used twice. CSS styling can be applied as desired. Conditional rules include: Is, Is not, Contains, Does not contain, Begins with, Ends with, Is blank, Is not blank.
Number field
Optional Prefix text Optional Suffix text
This field may display up to ten decimal places; it may also be set to restrict to whole integers only. Minimum and maximum values may be set. Conditional rules include: equal to, not equal to, less than, equal to or less than, greater than, equal to or greater than, blank, not blank.
E-mail field
Radio buttons
Only one may be selected at a time. You can also create custom key values for each option; this allows you to save one value internally while showing a different option to the user. Conditional rules include: Is, Is not, Is before, Is or is before, Is after, Is or is after, Is empty, Is not empty.
Hidden Fields
A hidden field may be used to submit information with the form that is not made visible in the form itself. You can specify simple alphanumeric text in a hidden field, or the field can contain a wide range of other data using tokens. Tokens are like placeholders (indicated by the use of [brackets]) that can display a wide range of variable data, including information about the form, dates and times, data from elsewhere on your site, etc. For example, if you use the token [ site:name ] in a hidden field, the field will include the actual name of your site. That information will not appear on the form, but will be included with the form submission. Talk to Web Services for more detail about tokens.

In this form, there is a hidden field with a token that provides the date and time the form was submitted. You can see it displayed on the confirmation page of this form. by selecting "I would like to see the time and date my form was submitted" above.

Select drop-down list
Only one item may be selected from the list. It can include any alphanumeric characters.
Date selection
Allows a date to be selected from drop-down boxes or a pop-up calendar, The pop-up calendar can be excluded if desired. The maximum range of dates available to choose from may be set as desired. A default date may also be set. Conditional rules include: Is on, Is not on, Is before, Is on or before, Is after, Is on or after.
HTML markup
Enables HTML markup to be used wherever you specify. For instance, entering
<p> <strong>Make this bold</strong></p> Displays text in HTML format as:

Make this bold

Page break
A page break may be placed anywhere on a form. Doing so will create "Next page" and "Previous page" buttons at the bottom of each page. Inserting page breaks also allows you to display a progress bar at the top of each page, indicating either the number of pages left to go, or the percent of the form that has been completed.
Check boxes
Any combination of checked or unchecked boxes is permitted. You may opt to have any boxes checked or unchecked by default. You can also create custom key values for each option; this allows you to save one value internally while showing a different option to the user. Conditional rules include: Is, Is not, Is before, Is or is before, Is after, Is or is after, Is empty, Is not empty. Logical and/or may be used to set rules for conditional behavior for any combination of checkbox selections.
question one
question two
question three
Provides multiple options for responding to multiple questions. The order of both the options and the questions may be randomized. One selection per row is permitted. Default selections may be specified. Any alphanumeric text may be entered as the label for each column ("question") or row("option"). You can also create custom key values for each option; this allows you to save one value internally while showing a different option to the user. No conditional rules are permitted for this element.
Time selector
Permits the user to select a time. You may choose to display the user's time zone time automatically or the website's time zone. For instance, the current time shown in this box is set to Central Time, the zone our main office offices operates on. Either 12 or 24-hr formats may be selected. Conditional rules include: Is at, Is not at, Is before, Is at or before, Is after, Is at or after.
A fieldset permits grouping of different form elements. It can be used to create logical sections of a form such as for addresses, full name, date and time, etc. All elements inside of a fieldset look and perform as they would outside of the set.
E-mailing and form data
When a form is submitted, Composer can generate an email to be sent to recipients you specify. The recipients may be members of your staff, or to an email address collected on the form, or both. A different email message can be sent to each recipient if you choose. In addition, the contents of the email and who receives it may be made conditional. For instance, if one of the questions on the form was answered a certain way, an email may be generated to one individual or group. If answered another way, the email may be sent to another individual or group. The contents of the email may include all, some or none of the data that was gathered on the form. Q2 advises against including sensitive or personal data in email messages regardless of encryption. The E-mail feature is a powerful and flexible way to provide notification about a form submission. It may also contain a link to the results page in Composer, where it can be viewed, analyzed and exported by an authorized user.
Form Options

Confirmation Page

You can create a message to appear upon submission of the form (i.e. a "Thank You" page). This page can be set to contain HTML markup and information gathered from fields on the form. Or, you may specify a URL to which the visitor is taken upon submitting the form.

Submission controls

You can specify the maximum total number of submissions allowed, and/or the maximum allowed by a single visitor over a period of 1 min., 5 min., an hour, day or week. You can also allow or deny permission to submit the form based on roles you have created. For instance, you may decide to permit Composer users or administrators to submit the form, but not anonymous visitors.

Progress Bar

If your form contains page breaks, you can include a progress bar that tracks progression through the form based on the number of pages completed or the percentage complete. Each progress point may be labelled with a title for the corresponding form page (i.e. "Your information"; Co-applicant information"; etc.

Preview/confirm form

Users may be permitted to review all or just some the information gathered prior to submission - you may determine what information is displayed. A custom message may be included at the top of the preview page. Users may return to the form to make any corrections; information gathered persists, avoiding the need to start over again to make a change.

Saving incomplete forms

Authenticated users (i.e. users who have signed in or registered) may save their form and return to it later using ther login to complete it. Partially completed forms are saved in the database.