Radio Button, Checkbox, and Drop-Down Fields

These fields allow the user to select from a predetermined list of options.

• Use a radio button field when the user must select one option from a small amount of options.
• Use a checkbox field when the user can select more than one option.
• Use a drop-down field when the user must select one option from a long list of options.

Settings

Editing Radio Button, Checkbox, and Drop-Down Fields in the Form Designer

1. Select the field on the canvas, and the options will appear in the right pane.
2. Under Field label, enter the field label that will appear next to the field on the form.
3. Under Variable, specify a name for the field variable associated with this field. If you do not specify a variable name, Forms will automatically assign the field one based on its label.
4. Under Text above field and Text below field, you can enter any additional text that should appear with the field. Click the Insert variable button to include a variable with this text.
5. Under Display options, select Required if users must fill in this field before submitting the form. Select Read-only if users should not be allowed to modify this field.

Note: If a required field is hidden with a field rule, it is no longer required. A required field is only required when it appears on the form.

6. Under Choices, specify the options users will choose from in this field.

   Note: The choices you specify for a drop-down, checkbox, or radio button must be different from each other. The same choice cannot be listed twice in the same field.

   • Use the Search choices field to edit specific choices in a long list.
   • Use the arrows to to the left of the Label column to rearrange the order of the choices.
   • Edit the labels in the Labels column by clicking in the text field for that choice.
   • Optional: Select one choice to be the default selection for the form. Checkbox fields allow more than one default to be selected.
   • Click Add choice to add a new choice to the bottom of the list.
   • Click Clear default value to remove the Default previously selected.
   • Click Import choices with a .csv or .txt file to open a text file containing a list, and append that list to the existing choices.
     Note: The format of the CSV file should be:
     

     Choice 1,Value_1,false
     Choice 2,Value_2,false
     Choice 3,Value_3,false

   • Click Export choices as .csv file if you would like to save a copy of the choices as a .csv text file.
   • Select Use a dropdown when the choice count exceeds the choice limit to automatically render the list as a drop-down on the form for long lists, set the Choice Limit to the number of choices that will be displayed before the list is converted. Does not apply to drop-drown fields.
   • Select Assign values to choices to add a Value column and the ability to assign a value for use instead of the choice label. This is useful when further processing will be performed, and a shorter URL friendly value is needed. Checkbox fields have a Value column by default.
   • Select Append choices to lookup results to allow a lookup rule to add to the list, rather than replacing the list, of choices.
   • Select Add 'Other' choice to allow the user to enter a custom value in case the list does not contain exactly what they are looking for.

Note: If multiple checkboxes are selected, the {/dataset/Checkbox} variable stores all the values in a single variable.

7. To configure advanced options, click the Advanced tab.
• For checkbox and radio button fields, under Layout, specify how the field choices will be displayed (in one to 4 columns or side-by-side).
• Under Tooltip, specify the help text that will appear when users hover over the field.
• Under CSS classes, specify CSS classes to assign this field. Learn more about using CSS.
8. To configure field specific rules, click the Rules tab.
9. Your field changes will be applied to the form automatically.

Note: The labels, tooltip, text above, and text below settings in the form designer support the use of simple HTML markup for formatting purposes.

Editing Radio Button, Checkbox, and Drop-Down Fields in the Classic Form Designer

1. Select the field on the canvas and click Edit.
2. Under Field label, enter the field label that will appear next to the field on the form.
3. Under Variable, specify a name for the field variable associated with this field. If you do not specify a variable name, Forms will automatically assign the field one based on its label.
4. Under Field options, select Required if users must fill in this field before submitting the form. Select Read-only if users should not be allowed to modify this field.

Note: If a required field is hidden with a field rule, it is no longer required. A required field is only required when it appears on the form.

5. Under Text above field and Text below field, enter any additional text that should appear with the field. Click the Insert variable button to insert a variable into the text.
6. For checkbox and radio button fields, under Layout (radio button and checkbox only), specify how the field choices will be displayed (in columns or side-by-side).
7. For drop-down fields, under Field width specify whether the field should be small, medium, large, or x-large in width
8. Under Choices, specify the options users will choose from in this field. Select the number next to a choice to make it the default choice. Checkbox fields can have multiple default choices.

   Note: The choices you specify for a drop-down, checkbox, or radio button must be different from each other. The same choice cannot be listed twice in the same field.

9. Assign a value to these choices. When you assign a value to a choice, the assigned value is stored for reporting and for use in the process. The choice, which is displayed to the person who filled out the form, is not stored. Assigning values to choices is especially useful if there is a monetary amount associated with a choice, and you want to use that amount to perform calculations.

Note: If multiple checkboxes are selected, the {/dataset/Checkbox} variable stores all the values in a single variable.

10. For checkboxes and radio buttons, you can include an "Other" field in the list by selecting Add "Other" choice.
11. To configure advanced options, click the Advanced tab.
• In the Advanced tab under Tooltip, specify the help text that will appear when users hover over the field.
• Under CSS class, specify a CSS class to assign this field. Learn more about using CSS.
12. Click Save to save your changes.

Populating Drop-down Lists with Database Values

To populate a drop-down list with database values

1. After creating the drop-down field, open the Lookup Rules page of the Fform designer.
2. If there aren't any lookup rules associated with this form, click New lookup rule. Otherwise, click the Add Rule button.
3. In the drop-down fields next to Available Sources, specify the data source, table/view, and the table name.
4. Delete the conditional statement (the line that says "When ____ matches with data source column...) by clicking the x button next to it.
5. In the Fill section, select the drop-down field you want to populate and the data source values that will populate it.
6. When you are finished editing the field settings, click Done. Your changes will be applied to the form automatically.