Multi-Select Field

Adding component

Basic properties
Components Basic Properties

View types
There are 3 view types for multi select fields on the form (1):

  • Single List ( available starting 2.16 release )
  • Dual List  ( available starting 2.16 release )
  • Checkboxes

Single List view type allows user to select multiple options holding CTRL (Windows) or Command (macOS) key (2):

Dual List view type allows user to select items in left column and move them to the right (or vice versa) using arrow icons (3):

Checkboxes view type represents select options as a set of checkboxes (4):

Both Single List and Dual List view options have "Size" setting which is used when list(s) height should be fixed.  

On the screenshot below "Size" is set to 4. It means that multiple picklist component height is fixed to display 4 rows only.

Multi-select dynamic options

For situations when data need to be added to a multi-select dynamically user is to use "Dynamic Options" (5) setting.

Options are to be passed as a semicolon-separated values or JSON.

Below are examples of caseType variable setup used to store dynamic multi-select options.

Passing semicolon-separated options:

Above variable will store case types labels separated with semicolon. Result string will look like following:

Mechanical;Electrical;Structural;Other;Issue;Question;Idea

NOTE: When using semicolon-separated values multi-select options keys will be same as options values.

Passing JSON allows one to create multi-select options with labels different from values ( available starting 2.16 release ).

Above setup will result JSON string storing case types as a key:value pairs where key is case type label and value is first 3 characters of the label.

Result string will look like following:

{"Mechanical":"Mec","Electrical":"Ele","Structural":"Str","Other":"Oth","Issue":"Iss","Question":"Que","Idea":"Ide"}

NOTE: JSON has to store object with "key":"value" pairs where "key" is option label and "value" is option value:
{"key":"value", "key1":"value1", ... }

To use variable as a source for dynamic multi-select simply add it to "Options" input (6):

To learn more about working with variables please refer following article: Variables

Virtual multi-select default value

User can provide default values separated by semicolon checking proper checkboxes (7):

For multiselect using JSON to build dynamic options user is to pass default option values (not labels)  separated by semicolon:

Multi-select option groups

Option Groups feature provides user with an ability to show specified options in multi-select component based on conditions.

Available only when 'Dynamic options' setting is set to false

Standard Option Groups

Select Input Multi Select (8) on a canvas and click "Add Group" button (9) under Option groups:

Check options to be displayed in multi-select (10), add condition (11) and click "Save changes" button (12):

Above condition will be satisfied for account record with "Prospect" type, those accounts will only have June and July options displayed for selection. All other accounts will have all three options displayed in multi-select component.

User can have multiple option groups set up for a single multi-select component.

Generated option groups

Starting with 3.1 release user can generate option group for the picklist based on object record type.

Below is SalesForce setup for "MultiSelect" picklist on Account for record type called "Customer Account".

Form source in example below is set to Account.

Select object field "MultiPicklist"(13) on the form. Click "Generate" button (14) on Options Group section and click "Yes" button (15) in popup:

Option group is generated based on the record type setting:

Conditional styles

Input Multi-Select component has following conditional styles options:

  • hide
  • show
  • required
  • disable
  • clear

Form components conditional styling

0 Comments

Add your comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.