Configure Field Options

Field options customize form fields behavior in order to build dynamic forms and user journeys. For instance, you can:

  • Show tooltips with detailed descriptions for your form fields
  • Make fields read-only to prevent modifications
  • Mark mandatory fields as required
  • Streamline the user experience with custom JavaScript code that executes when a field updates. For instance, you can show only relevant cities based on the selected country, automatically change an account currency based on the selected country, or show/hide CIF/CNP fields based on selected customer account type.
NOTE  
Form field options are applied only at the user interface level, not in the data model. For instance, marking an attribute field as required in a form driven flow, does not make the attribute mandatory in the entity's data model.

Customize Form Fields

To customize form fields for specific attributes, in the configuration page of the form driven flow, select the Field Options tab and click Insert to customize the field for a specific attribute. Then, fill in the corresponding settings for the field:

Field Description
Use Virtual Attribute Tick when rendering fields for data extensions to make them available in the Attribute field.
Attribute At the right-side of the Attribute field, click the drop-down and select the attribute for which you wish to customize the form field. This field is mandatory.
Show Tooltip Inherit (default value). Inherits the tooltip show options selected on the General tab. If no options have been previously selected, the default will be User Settings, which means that the users will be able to show tooltips by toggling on / off the Tooltips button displayed at the top-right corner of the UI.
NOTE  
The Tooltips toggle button is available in the Digital Experience Portal only when tooltips are available on the journey.
  • YES.  Always show tooltips in the Portal UI on forms and user journeys when users hover their mouse on the attributes on fields which have tooltips. The users do not have the possibility to toggle the tooltips off.
  • No. Never show tooltips in the Portal UI on the data form / digital journey. The users do not have the possibility to toggle the tooltips on.
Custom Tooltip The text which will be shown in the tooltip in the Portal Ui. The tooltip text is localizable.
NOTE  
The maximum length of the tooltip text is 500 characters.
Lookup View Name
(Lookup attributes)
Predefined view used to select values for the attribute. If no value is selected, the attribute's default view is used.
Lookup as DropDown
(Lookup attributes)
Display the lookup attribute values in a drop down grid instead of a separate grid window.
Lookup as Select Box
(Lookup attributes)
Display the lookup attribute values in a simplified list. The list doesn't have a header and contains only the values from the first column of the referenced entity’s data view.
Show Edit Button
(Lookup attributes)
Display the pencil button allowing you to edit the selected lookup attribute.
Lookup Edit Form
(Lookup attributes)
Predefined form used to edit the selected lookup attribute. If no value is selected, the attribute's default edit form is used.
Lookup Show Insert Button
(Lookup attributes)
If the lookup attribute is selected from a grid window, not from a drop down list, the grid will not include the Insert button (you will not be able to add new lookup attribute records).
Field is Read Only The field will be non-editable.
Field Required Level The Required Level drop-down allows you to choose if a specific attribute (field) is to be mandatory, recommended or optional:
  • None – The field is optional. No error message will be displayed if the field is empty.
  • Recommended – A blue dot will be displayed on the upper-left corner of the field in the user interface to indicate that it might be useful to fill in the field.
  • Required – A red dot will be displayed on the upper-left corner of the field in the user interface to indicate that it is a mandatory field. The end user will not be able to add a new record if the field will be left blank. 
UI Template Allows you to select a placeholder for either email or phone.
Select the template available for your attribute. After the selection is done, a HTML code will be displayed.

Order Option Set Items
(Option Set attributes)
  • Default - Same as By Order Index.
  • By Order Index - Sorts option set items based on the order index set up in the option set.
  • Alphabetical - Sorts option set items alphabetically by display name. Sorting is applied after localization, ensuring correct order in any language.
Open Calendar on Click
(Date, DateTime, and Invariant Date attributes)
  • Yes - Clicking the input field opens a date picker (a calendar interface) that allows the user to select the date.
  • No - When clicking the input field, the user has to type the date manually. The date picker is still available via the calendar icon located to the right of the input field.
Placeholder
(Date, DateTime, and Invariant Date attributes)
Displays a temporary grayed out text in the input field when empty. Allows you to provide a hint or example of the expected input format or type of data (e.g. DD/MM/YYYY).
Validation Message Mode
(Date, DateTime, and Invariant Date attributes)
  • Auto - Displays the red exclamation mark if the input is invalid. The corresponding error message expands only if the user clicks the icon.
  • Always - Automatically expands the error message when the input is invalid (e.g., “Value must be a date or time” or “Value is out of range”).
Use Mask Behavior
(Date, DateTime, and Invariant Date attributes)
This option is applicable only if Open Calendar on Click (Date, DateTime, and Invariant Date attributes) is disabled.
Allows the user to enter a date or time using keyboard navigation:
  • Left/Right arrow keys select segments (day/month/year/hour/minute, etc.).
  • Up/Down arrow keys increment or decrement the selected segment.
  • Direct typing overrides the currently selected segment.
  • The mask auto-advances (e.g., entering two digits in the day segment moves the cursor to the month).
  • Invalid inputs are blocked or corrected automatically (e.g.: typing 19 in a month field replaces it with 09).
  • Delete or Backspace resets the current segment and moves to the next or previous one.
  • Home or End selects the first or last segment, respectively.
Minimum Value
(Numeric attributes)
The smallest number that can be entered in the field.
Minimum Value
(Date or DateTime attributes)
The earliest date allowed. Prior dates are disabled in the date picker and trigger an error if entered using the keyboard.
  • Reference Date - A static (exact date) or dynamic (now, first date of the current month, or last date of the current month) date that you can use as is or as a starting point for defining the minimum value.
  • Select Exact Date - If you picked an exact date for the reference date, specify the date.
  • Plus or Minus - Adds or substracts a time interval from the reference date.
  • Interval Unit - Select if the interval you wish to add or substract from the reference date is measured in days, months, or years.
  • Interval Value - Enter the number of days, months, or years you wish to add or substract from the reference date.
Maximum Value
(Numeric attributes)
The largest number that can be entered in the field.
Maximum Value
(Date or DateTime attributes)
The latest date allowed. Later dates are disabled in the date picker and trigger an error if entered using the keyboard.
  • Reference Date - A static (exact date) or dynamic (now, first date of the current month, or last date of the current month) date that you can use as is or as a starting point for defining the maximum value.
  • Select Exact Date - If you picked an exact date for the reference date, specify the date.
  • Plus or Minus - Adds or substracts a time interval from the reference date.
  • Interval Unit - Select if the interval you wish to add or substract from the reference date is measured in days, months, or years.
  • Interval Value - Enter the number of days, months, or years you wish to add or substract from the reference date.
File Open
(File attributes)
Allows you to set the option to either preview or download the files on your computer. If you select the Open&Download option, click on the document to choose between opening the file or downloading it on your computer.
  • Open
  • Open&Download
  • Download
    NOTE  
    The supported file formats for preview (open) are: .jpg, .jpeg, .pdf.
UI Template Options This field is shown only if the UI Template is selected. You can customize the selected placeholder by modifying the code based on your preferences.
For the Phone Placeholder UI templates, the following options are available:
  • type – "tel"
  • autocomplete – true/false. Selects the use of the browser's autocomplete feature.
  • placeholder – Displays a grayed out value for exemplification purposes when the field is empty.
  • default_country – Phone number format based on the ISO 3166-1 aplha-2 country codes used by default.
  • onlyCountries – List of allowed phone number formats based on the ISO 3166-1 aplha-2 country codes. When empty, all country-specific phone number formats are available.
  • countryOrder – Phone number formats based on the ISO 3166-1 aplha-2 country codes displayed at the top of the list in the specified order.
  • excludeCountries – Phone number formats based on the ISO 3166-1 aplha-2 country codes excluded from the list.
  • validationNumberType - Indicates if the UI template allows landline and/or mobile phone numbers. Available options are: "FIXED_LINE", "MOBILE", and "FIXED_LINE_OR_MOBILE".

For instance, the template options below

Copy
return {
    type: "tel",
    autocomplete: true,
    placeholder: "123456789",
    default_country : "ro",
    onlyCountries: [],
    countryOrder: ['ro', 'us', 'gb'],
    excludeCountries: [],
    validationNumberType: ['FIXED_LINE_OR_MOBILE']
}

will create the following field:


Attribute Change Event Code to be executed each time a form field is updated. For instance, you can dynamically populate a lookup field based on the value selected in another field. For more information, see Configure Field Rules.

Configure Field Rules

To create field rules, on the entity linked to your form driven flow, you should have at least two attributes defined, one for the condition and the second for the action. For example, if you want to display relevant cities based on the selected country, on the accountInsertForm digital journey of the account entity, you have to add the country field and the city field on which you define the action (where both fields are lookup fields). If the data form does not have the two fields, add them.

1 Add field for action

Configure the field used as filtering criterion (eg. country) as described in the Customize Form Fields section.

2 Add field for condition

Add the field which is filtered (e.g., city) and configure it as described in the Customize Form Fields section.

Then, in the Attribute Change Event field, provide the piece of code to be executed each time the lookup value of the country field changes, for instance:

Copy

var accountCountryId = ebs.getFormAttributeValue("ebsContainerContent", "Country")
ebs.getByQuery({
        entity: {
                alias: "a",
                name: "accountCountryId",
                attributelist: [
                        {
                        name: "Cities",
                        }
            ]
        },
        "where": {
            "type": "and",
            conditionlist: [
                        {
                        first: "a.accountCountryId",
                        type: "equals",
                        second: "val("+ accountCountryId +")"
                        }
                    ]
        },
function(e){
        if(e.Records != null && e.Records != undefined && e.Records.length > 0)
            {
            ebs.setFormAttributeValue("ebsContainerContent", e.Records[0].a_accountCountryId);
            }
})        

Save the field, then save the form driven flow.

In the user interface, each time you select a country, the list of cities will include only cities that belong to that country (i.e., the cities relevant for the country).