Automatically Populate Country and State Dropdowns

Manually adding every country or state to a dropdown field can be time-consuming and error-prone. Digioh provides a faster, more reliable option using Extension #60 – Country Dropdown, which automatically populates country and state values for you.

This article explains how to configure country and state dropdowns using metadata, how submission values behave, and how to customize or extend the default data.

When to Use This

Use this feature when you want to:

• Add a Country and/or State/Province dropdown without manual data entry

• Ensure consistent values are submitted to downstream systems

• Dynamically show or hide the State field based on the selected country

• Support custom country or region lists using your own data source

Prerequisites

• Extension #60 – Country Dropdown must be installed in your Digioh account

• The form field must be of type “Dropdown”

• You must be able to add metadata to form fields
  (See: How do I add Metadata)

⚠️ Auto-population only works with Dropdown fields. Other field types are not supported.

Basic Setup: Country Dropdown

1. Add a Dropdown field to your form.

2. Open the field’s Metadata settings.

3. Add the following metadata key:

country_auto

4. Set the value to one of the following:

   • name – submits the full country name
     (e.g., “United States”)

   • code – submits the ISO alpha-2 country code
     (e.g., “US”)

   • phone-prefix – displays the country name with its dialing code and submits values like +1

When the form loads, the dropdown will automatically populate with the full list of countries. No manual entry is required.

Note the empty value for the default "Select your country" option. This is important if you want to make the dropdown a required field. Digioh will reject blank submit values for required dropdowns.

Adding a State / Province Dropdown

To add a dependent State or Province dropdown:

1. Add a second Dropdown field to your form.

2. Add the following metadata key:

3. Set the value to:

   • name – submits full state/province names (e.g., “California”)

   • code – submits abbreviated codes (e.g., “CA”)

Default Behavior

• United States and Canada are supported by default.

• When a supported country is selected, the State dropdown is populated automatically.

• For unsupported countries, the State dropdown is automatically hidden.

State drop down configured to submit code:

For non-US countries, the app will automatically hide the State field (if present and configured with metadata state_auto):

Adding a State / Province Dropdown

To add a dependent State or Province dropdown:

1. Add a second Dropdown field to your form.

2. Add the following metadata key:

3. Set the value to:

   • name – submits full state/province names (e.g., “California”)

   • code – submits abbreviated codes (e.g., “CA”)

Default Behavior

• United States and Canada are supported by default.

• When a supported country is selected, the State dropdown is populated automatically.

• For unsupported countries, the State dropdown is automatically hidden.

Submit Value Behavior (Name vs Code)

The metadata value controls what is submitted, not what the visitor sees.

The same logic applies to states and provinces (e.g., California vs CA).

This allows you to match submission formats required by ESPs, CRMs, or other integrations without changing the user experience.

Automatic Country and State Preselection

By default, the extension attempts to preselect a country and state based on the visitor’s detected geolocation.

Important notes:

• Preselection is visual only

• No value is written to the Digioh data layer until the user interacts with the field

• This prevents silent data collection without user action

Disable Preselection (Optional)

To disable automatic preselection, add one of the following metadata keys:

Ordering Countries in the Dropdown

You can control which countries appear at the top of the list using:

This value accepts a comma-separated list of ISO alpha-2 country codes.

Example:

• These countries will appear first, in the order specified

• All remaining countries will follow in alphabetical order

• This does not control which country is selected by default

Using Custom Country and State Data (CSV)

You can replace the default datasets by pointing the extension to your own CSV files using Google Sheets.

Supported Metadata Keys

Each value should be a Google Sheets CSV export URL, for example:

Required CSV Formats

Country CSV must include:

• name

• code

• country-code

• phone-prefix

State / Province CSV must include:

• name

• code

When these metadata keys are present, the extension uses your custom data instead of the default lists. This enables:

• Non-US regions

• Custom naming conventions

• Organization-specific datasets

Required Fields and Default Empty Option

Auto-populated dropdowns are intentionally left unselected when the form loads.

This is important because:

• Digioh rejects submissions with blank values for required dropdowns

• A default empty option (e.g., “Select your country”) ensures validation works correctly

Best practice:

• Keep the default empty option

• Avoid forcing a selection unless explicitly required

Limitations and Notes

• Only Dropdown field types are supported

• State auto-population works by default for United States and Canada

• Other regions require a custom CSV

• Visible labels are always full names, regardless of submission format

Running into an issue or have a question? Reach out to our support team via support@digioh.com and we'll be happy to help!