Select Box (Drop-down List)

26 Jan Select Box (Drop-down List)

Click on Form Elements Toolbar to add select box (drop-down list) to the form. To achieve its properties just do right click over element and then click Properties. All properties are organized into 5 groups: Basic, Style, Data, Logic and Advanced. To view/edit certain group of properties just click appropriate tab on Element Properties window.

Basic Properties

• Name. The name will be shown in place of the label throughout the plugin, in the notification email and when viewing submitted form entries.
• Label. This is the label of the field.
• Options. These are the choices that the user will be able to choose from. You can add as many options as you need manually or insert a set of pre-defined options such as countries, states, provinces, etc.
• “Please select” option. Adds an option to the top of the list to let the user choose no value.
• Autocomplete attribute. Choose the value of the autocomplete attribute. It helps browser to fill the field value, if required.
• Description. This description appears below the field.
• Required. If enabled, the user must fill out the field. You also can specify error message here.

Style Properties

The general view of input fields is configured through Form Settings. It’s applied to all input fields. Here you can adjust view of the field.

• Label style. Choose where to display the label relative to the field and its alignment.
• Input style. Adjust the input field style (size and text alignment).
• Description style. Choose where to display the description relative to the field and its alignment.
• Custom CSS class. This class name will be added to the input field.
• CSS styles. Set custom css for certain element parts and states.

Data Properties

• Dynamic default value. Allows the default value of the field to be set dynamically via a URL parameter.
• Parameter name. This is the name of the parameter that you will use to set the default value.
• Submit on choice. If enabled, the form will be submitted when an option is chosen.
• Save to database. If enabled, the submitted element data will be saved to the database and shown when viewing an entry.

Conditional Logic

Here you can create rules to show or hide the element depending on the values of other fields.

Advanced Properties

• ID. The unique ID of the input field.
• Validators. Validators check whether the data entered by the user is valid. If not, then appropriate error bubble is displayed for this field. The following validators are available:
  • Equal. Checks that the value is identical to the given token.
  • Greater Than. Checks that the value is numerically greater than the given minimum.
  • In Array. Checks that the value is in a list of allowed values.
  • Length. Checks that the length of the value is between the given maximum and minimum.
  • Less Than. Checks that the value is numerically less than the given maximum.
  • Prevent Duplicates. Checks that the same value has not already been submitted.
  • Regex. Checks that the value matches the given regular expression.