Dropdown fields allow users to select an option from a list of options. The options are only visible when the user clicks the dropdown arrow, so you can add as many options as needed without taking up space in your form. To add one to a form, click Dropdown in the form builder's Add Fields tab.

Standard field options

A Dropdown field has the following standard options. Select the field in the form builder to see them in the Field Options tab. Most of them are in the Advanced section, so click Advanced to show them.

The Dropdown Options section is open when you first select the field, and it's covered in Field-specific options below. Click its heading to close it, and Advanced sits right under it.

With Advanced open, the panel shows the options below. Validation Messages and Conditional Logic are separate sections under it. Click either heading to expand it.

• Field Type
• Required
• Field Key
• Placeholder Text
• Field Description
• CSS Layout Classes
• Label Position

A Dropdown field has no Field Size option. To make the dropdown only as wide as its longest option, check Automatic width in the Dropdown Options section.

• Unique
• Read Only
• Visibility
• Before & After Input
• Conditional logic
• Dynamic default value
• Lookup

Field-specific options

In addition to the standard field options, Dropdown fields have several field-specific options. Browse the sections below to learn more about the options specific to Dropdown fields.

Add option

Click the plus (+) icon next to an option to add a new option to your field.

Reorder individual checkbox, radio, or dropdown options by dragging the drag icon to the left of each option.

A popup message appears when you add a duplicate option value. This prevents issues with duplicate values in a field.

Bulk edit options

To add, edit, or remove many options at once, use the Bulk Edit Options link above the list of options. Checkboxes, dropdowns, and radio buttons all have it.

Click Bulk Edit Options and type your choices into the box that appears, one per line. To fill the box with a ready-made list, pick one of the presets: Countries, U.S. State Abbreviations, U.S. States, Age, Satisfaction, Importance, Agreement, or Likely. Click Update Options to apply the list.

To bulk edit options with separate values, first check Use separate values. Then put the label, followed by a |, followed by the value. For example:

Excellent|10
Very Good|8
Fine|5
Not so great|3
Poor|1

Add "Other"

Allow users to enter free text with an "Other" option. Click Add "Other" below the list of options to add it. When the user selects "Other" on the front end, a text box appears where they type their own answer.

To show a hint inside that text box, type it in the Other placeholder box under the "Other" option. The placeholder disappears as soon as the user starts typing. The box is empty by default, so no placeholder shows.

Use separate values

Check Use separate values to store a value that differs from the option the user selects. It's unchecked by default.

For example, if your user selects black t-shirt, you can store the value as black t-shirt $25.00. Use [x show="value"] to display the saved value, where x is the ID or key of the field.

Multiselect

Check Multiselect to allow users to select multiple options from a dropdown. It's unchecked by default. The field then shows as a list box with several options visible. The user needs to hold down Command or Control to select more than one option.

Autocomplete

Check Autocomplete to suggest options to users as they type. It's unchecked by default. This feature uses the Slim Select dropdown library, so autocomplete also works on mobile devices.

When Multiselect and Autocomplete are both checked, the user can choose multiple options without holding down Command or Control.

Set option limits

To cap how many times each option can be selected across all entries, check Set option limits. It's unchecked by default. Leave an option's limit blank to keep it unlimited.

See Selection Limits for Checkbox, Radio Button, and Dropdown Options for the settings.

Default values and field icons

Set a dynamic default value in your Dropdown field. To retrieve a value from an entry, see the Get a Value From an Entry page. To set a default value with one of our dynamic shortcodes, see the Default Values page.

The default value icons can be used to specify whether an option selected in a Dropdown field on the form builder page is a default value or a placeholder. Learn how to set a default value and how to set a placeholder in a Dropdown field.

On the form builder page, drag a field by its move icon to move it. To duplicate or delete a field, click its More Options (⋮) icon. See field action icons for more information.

Display Dropdown fields

Display the value submitted in a Dropdown field in a form's confirmation message, email, or View. The field ID shows next to the field name at the top of the Field Options tab. The field key is in the Field Key box under Advanced.

• Display submitted option(s): Display the option(s) selected in a Dropdown field.
  

  [x]

  Replace x with the ID or key of the Dropdown field.
• Display saved value: If Use separate values is checked in the Dropdown Options section, display the saved value with show="value":
  

  [x show="value"]

  Replace x with the ID or key of the Dropdown field.
• Separator: If Multiselect is checked, use a different separator for Dropdown field values. By default, this will be a comma.
  

  [x sep=", "]

  Replace x with the ID or key of the Dropdown field.

Related developer hooks

• Populate a Dropdown field with WordPress posts with the frm_setup_new_fields_vars hook.
• Remove used options with the frm_setup_new_fields_vars hook.
• Add a user list to a Dropdown field with the frm_setup_new_fields_vars hook.
• Create a new set of preset Bulk Edit options with the frm_bulk_field_choices hook.
• Revert to using Chosen JS as the autocomplete dropdown library with the frm_use_chosen_js hook.