Super Forms
  • Drag & Drop Form Builder for WordPress
  • Quick start
    • Installation
    • Registration
    • Starting your 15 day trial
    • Purchasing a license
    • Activating a license
    • First time setup
    • Secure file uploads
    • Creating a form
    • Adding form elements
    • Editing elements
    • Publishing your form
    • FAQ
  • Account
    • Dashboard
      • Your Invoices
      • Billing details
      • Your Licenses
      • E-mail Notification
      • Password reset
      • Cancel subscription
  • Common problems
    • Common problems
      • Email delivery problems
        • Why is my form not sending emails?
        • Why are emails going into spam folder/inbox?
      • File upload problems
      • Session expired
      • reCaptcha Troubleshooting – Fix “Not Loading” & Verification Errors
  • Elements
    • Layout elements
      • Column/Grid
      • Multi-part / step
    • Form elements
      • Calculator
      • Signature
      • File upload
      • Datepicker
      • Variable field
      • Dropdown
      • Text field
      • Autosuggest
      • Keywords
      • Radio button
      • Keyword Field
      • Button
      • Audio Recording (microphone)
    • HTML elements
      • Heading
      • HTML (raw)
      • Image
      • TinyMCE
      • Divider
      • Spacer
      • PDF page break
      • Google map element WordPress form
  • Features
    • Basic
      • Confirmations emails
      • Save Form Progression (continue later)
      • Build In Translation System
      • Populate form
      • Popups
      • Import & Export
      • Hide form after submitting
      • Hide or lock out user from your forms
      • Validation
    • Advanced
      • WordPress form with Google sheets dropdown
      • Custom registration form for WordPress
      • Custom login form for WordPress
      • Custom lost password form for WordPress
      • Update current logged in user
      • Secrets
      • Prevent duplicate entries
      • Lock & hide form
      • Password protect
      • Conditional Logic
      • Tags system
      • Address lookup/auto complete
      • Analytics Tracking
      • Conversion Tracking
      • Distance & Duration Calculation
      • If statements
      • Foreach loops
      • E-mail Reminders
      • Variable Fields
      • Form templates - Include elements into other forms - WordPress
      • Transferring data from one form to another
    • Integrations
      • PDF Generator
      • Listings
      • WooCommerce Checkout
        • Fixed price checkout
        • Dynamic price checkout
        • Variable product checkout (variations)
        • Replacing the "Add to cart" on a product page with a form
        • Hiding product from shop and order via custom form
      • PayPal
      • MailChimp
      • Mailster
      • Zapier
      • Stripe (BETA)
      • WooCommerce Instant Order (in progress)
  • Tutorials
    • WordPress Form to Google Sheet Integration
    • GDPR Consent / Terms agreement
    • How to update the plugin
    • Sending emails to specific department for WordPress contact forms
  • Example Forms for WordPress
    • Booking 24 hours ahead of time
  • Developers
    • Code Examples
      • Lookup City by Zipcode for your WordPress form
      • Audio Recording Field
      • Custom API Phone Number Validation for Your WordPress Form
      • Updating WordPress user meta data after login
      • Automatically redirecting to next step after displaying text or a progress bar
      • Dropdown with groups (categories)
      • Prevent form submission based on entered field values
      • Track form submissions with GTM (Google Tag Manager)
      • Tracking Multi-part steps with Google Analytics
      • Tracking Multi-part steps with GTM data layer (dataLayer.push)
      • Track form submissions with third party
      • Compare input field value with database value
      • Insert form data into a custom database table
      • Delete database row after contact entry is deleted in WordPress
      • Limited date availability (slots) for your WordPress booking form
      • Send submitted form data to another site
      • Exclude empty fields from emails
      • Execute custom JS when a column becomes conditionally visible
      • Toolset Plugin: Update comma separated string to Array for meta data saved via Front-end Posting
      • Toolset Plugin: Update file ID to file URL for meta data saved via Front-end Posting
      • Delete uploaded files after email has been send
      • Increase Cookie lifetime for client data such as [Form Progression]
      • Altering cookie secure and httponly parameters
      • Define fake cronjob to clear old client data if cronjob is disabled on your server
      • Define page language attribute based on page ID or URL
      • Define custom headers when doing a POST request
      • Change checkbox/radio layout to vertical on mobile devices
      • Show remaining available form submission allowed
      • Global fields / elements
      • Trim values of fields
      • Re-sending E-mails after editing entries via Listings for WordPress
      • Combine multiple field values into one column on Contact Entries page
      • Altering the attachments for E-mails via PHP code for WordPress
      • Generate dynamic columns with dates based on user selected date from Datepicker element
      • Hide `eye` icon from Listings row based on user role
    • Data storage
    • BETA version
  • Changelog
  • Support
Powered by GitBook
On this page
  • What is a Dropdown element?
  • How to add a Dropdown element?
  • How to set a maximum or minimum selection?
  • How to disable the option to filter items?
  • Retrieving WordPress taxonomy as items
  • Retrieving WordPress posts as items
  • Features & Options
  1. Elements
  2. Form elements

Dropdown

Adding a dropdown element to your WordPress form

PreviousVariable fieldNextText field

Last updated 1 year ago

What is a Dropdown element?

A dropdown element (also know as "select menu" or "select") is an element where a user can choose an item (or multiple items) from a list. For instance when you ask what color they want for their t-shirt, you could use a Dropdown element with different colors to choose from.

How to add a Dropdown element?

On the builder page, open the Form Elements panel. Search for the Dropdown element, and drag it to your canvas. You can now edit the element and configure it as desired by following the settings and the descriptions.

How to set a maximum or minimum selection?

By default a user can only select 1 item from the dropdown. If you require a user to be able to select multiple items or a maximum of X items, you can configure this by editing the Dropdown element, navigating to the Advanced section. And configuring the max/min selections.

How to disable the option to filter items?

By default a user is able to filter dropdown items by typing while the dropdown is opened (focused). In some use cases this might be undesired. In that case you can disable the filter by enabling "Disallow users to filter items" as shown below:

Retrieving WordPress taxonomy as items

To populate the dropdown with taxonomy items e.g. Post categories (category), or WooCommerce product categories (product_cat) you can set the Retrieve method to "Specific taxonomy (categories)". Simply enter the Taxonomy slug. Optionally you can exlude specific category ID's to be excluded from the list. And to hide any empty categories as shown below.

Retrieving WordPress posts as items

To populate your dropdown with posts (or a custom post_type) you can set the Retrieve method to "Specific posts (post_type)". For example, you could return a list of WooCommerce products by entering products. You may also filter based on post status, and define a limit. Ordering by title, date or other parameters is also possible.

If you require to exclude a product you may enter the post ID's separated by comma's.

When you wish to filter posts by a specific taxonomy then you can define each filter. For instance to only return products based on a the taxonomy books and movies, you can define a filter like so:

slug|books,movies|product_cat|IN

Alternatively you can filter based on tags like so:

slug|red,green|product_tag|IN

Operators you may use are IN, NOT IN, AND, EXISTS and NOT EXISTS

Features & Options

This element shares the same options as the Checkbox element + the following extra feature:

  • Distance / Duration calculation (google directions) setup instructions

    • Return distance in meters

    • Return duration in seconds

    • Return distance text in km/meters (metric) or miles/feet (imperial)

    • Return duration text in minutes

Since you are retrieving posts, you can also define what value you'd like to return for the dropdown items. For instance you can choose to return the Slug, ID, Title or some Custom post meta data (which allows you to return multiple values for a single item). Which allows you to use {fieldname;2} as shown below, which returns both the product ID and Product price. Which can be retrieve with {fieldname;1} and {fieldname;2} respectively.

Setting up Google Sheets for your Dropdown element.
Disabling dropdown search/filter.
Retrieving taxonomy as items for your Dropdown element.
Retrieving posts as items for your Dropdown element.
Returning custom meta data from posts for the Dropdown item value.
Disabling dropdown search/filter.
Retrieving taxonomy as items for your Dropdown element.
Retrieving posts as items for your Dropdown element.
Returning custom meta data from posts for the Dropdown item value.
Advanced tags