This documentation is also available on the MyLO Documentation portal: https://my.lwv.org/mylo/learning-about-form-components

Form Component Types

Date

Provides month, day and year drop-down fields, as well as a pop-up calendar, for date input.


E-mail

Provides a field for e-mail address input, and validates the submitted value is an e-mail address. 


Fieldset

Used for grouping form components; use the drag-and-drop handle to arrange components that are part of the group as child items of the fieldset.


File

Provides a file upload for attaching files to form submissions.


Grid

Provides a grid formatted field for radio button (single selection) or check box (multiple selection) input. Questions are formatted as rows, and responses are formatted as columns. All questions in the grid component have the same options for a response. Create separate grid components for differents sets of responses.


Hidden

Provides a hidden field for internal content entry. Label and text in hidden field will not be displayed on the webform, but will be included in the data saved. A Hidden field does not provide for any input by the webform submitter. 


Markup

Provides a field for content entry by the form creator. Content in the markup field will be displayed on the webform. Markup fields are typically used for text, links, or images to be displayed within the webform components - i.e. for additional instructions. A Markup field does not provide for any input by the webform submitter. 


Number 

Provides a field for number input.  


Page Break

Provides a field for number input.  


Select Options

Provides a select field for text input. Radio buttons are provided for single value selection. Check boxes and list boxes are provided for multiple value selection. 

Radio buttons: 

List Box:


KNOWN BUG for Select Options: 

All Select Options form components will display the label twice (the label is the name of the form component). To avoid the duplicate display of the label, follow the instructions below to enable the workaround: 
  1. From the Form Components tab of your webform, Edit the form component label so that the Label Display is now set to None rather than it's default setting: Above. This will remove the label entirely (removing the duplication, too).
  2. Then, create the form component type, Markup, with the same title as the original form component ("How did you hear about us?"), but the form key must differ to avoid duplication of form keys.
    1. After adding a label name and unique form key to this Markup form component, this is the step where you change the text editor from WYSIWYG to Full HTML.
    2. In order to get it to still look like a label, and, more importantly, read as a label by the browser, you would use the following (w/ the red text being required and the green text being your customizable text): 
      1. <label>Component Label<span class="form-required">*</span></label>
        1. The HTML text above is for a required field. If your Markup/Select Options is not a required question, remove this portion before pasting into your text editor: 
          <span class="form-required">*</span>
      2. You can also add a description below, for example:
        <label>Component Label <span class="form-required">*</span></label>
        <p class="description">Description</p>


Textarea

Provides a field for number input.  


Textfield

Provides a field for number input.  


Time

Provides a field for number input.  



Workaround: Select Options displays double label (the question appears twice)





Source: https://d7help.appstate.edu/form-components/form-component-types. Edited by MyLO Team.