Field Settings (common)
The following settings are available for most Field Types:
Setting | Description |
---|---|
Field ID | Unique internal identifier of the field. This is a read-only field. Field ID is automatically created when a new field is placed on a page. |
Field Label | Used for most field types except Document Viewer, Domain Tile Selection, Separator, and Navigation Menu. |
Use label as a placeholder | Used for those field types, where the user may enter data freely. Appears as a tip inside the field. If deselected, a different placeholder text can be specified. |
Placeholder | Text that will be visible to the user inside the field as a tip. |
Info message | A rich text message that appears as a tool-tip next to the field label, when the user hovers over the icon. |
Info message header | A heading for the tool-tip message. Appears in a bold, larger font, one line above the rest of the text. Example: Tool-tip info message with a header |
Info message position | Controls how the tool-tip text is aligned relative to the icon. |
Meta Field Name | Used for all field types that may carry data to the system. This is the unique name for the data held within the field as it is referenced by code and in the database. If the data from this field must be mapped to a specific field in a PDF form, use the predefined values from the Field Names Table. If the data is only used for the purposes of this wizard, e.g. as a selector for further transitions, then you may create any name for it. Notation for Meta Field Names is described in How to Choose a Meta Field Name. Sample: Warning! This is a mandatory setting. If left empty for any of the fields, the wizard will not function properly. This issue is logged in the console. When a wizard doesn't load (a blank screen appears to the user), please check the console for configuration errors. Warning! Unless the name comes from the Quick field list, the Meta Field Name must start with a letter. It may contain letters, numbers and underscores ("_"). Other characters are not permitted and will prevent the wizard from functioning properly. |
JS code that will be performed, when the value in this field has been changed (by the user or from widget code). If necessary, the previous field value can be referenced from code as oldValue. | |
Initial value | A JavaScript expression that provides a specific value that is used as the default value for this field. It is shown and selected as the first value for this field when the user opens the page. E.g., a choice in a drop-down, that is initially selected, or a string in a text field that is already filled in. To enter a string or a value from choices, use quotes. E.g. "Yes" The JS expression's execution context has only 2 variables:
|
Validations | Validations that will be performed for the specific field. This setting overrides the default validations defined in the Wizard settings. |
Use default validations | Enables 'Default validation' configured in the Wizard settings to be run on this field. |
Hide validation errors | Hides all validation errors for this field. |
ID | Unique identifier for this rule. This ID can be used to distinguish validation errors programmatically. |
Description | Description of the rule understandable to you and other developers. |
Async checkbox | With asynchronous validation enabled, an expression can return a Promise that resolves with validation result. |
Debounce delay | The amount of time in milliseconds, that needs to pass after the last value has changed, for the validation to be executed. Asynchronous validations are usually run on the server-side. With the delay, the server will not run the validation for every value change, but only when the user has finished entering data into the field. |
Expression | JavaScript expression that returns a validation result, which can be one of the following:
{
id: string // id for this validation rule
isFulfilled: boolean // true if the rule is fulfilled
error: {
id: string // id for this error
description: string // error text that will be shown
// to the user instead of the 'Error Message'
}
} |
Error message | Error message text that will be shown to the user. |
Column Span | The page of the wizard is divided into two invisible columns. These values can be used:
Note: The column span is ignored when the Size by content setting is selected. |
Enabled condition | Boolean JavaScript expression. If the result evaluates to TRUE or if this setting is left empty, the field will be available for editing to the user, visible and enabled. Otherwise, it will be disabled and will not be rendered on the page. The value of a disabled field will not be saved to a Work Item, but it will remain available in the |
Visibility Condition | Boolean JavaScript expression. If the result evaluates to TRUE or if this setting is left empty, the field will be visible to the user. Otherwise, the field will not be rendered on the page. |
Read-Only Condition | Boolean JavaScript expression. If the result evaluates to TRUE, the field will be visible to the user, but as a read-only value. Otherwise, it will be editable. |
Default Value | A JavaScript expression that provides a "hard-coded" value for this field. It will be used as the value for this field even if the user tries to change it. Usually used for fields that are hidden to the user. To enter a string or a value from choices, use quotes. E.g. "Yes" The JS expression's execution context has only 2 variables:
|
Required | If selected, the user will be required to fill in this field. This is a built-in validation. An asterisk will be displayed next to the field label. |
New Line | If selected, the field will start on a new line on the page. |
Size by content | If the option is selected, the size of the field will change (stretch) to match the content in it. The Column Span and Horizontal Alignment settings will be ignored. This allows to place more than two fields on the same row. If the option is not selected, the field will take up one or two columns on the page, depending on the value in the Column Span field. |
Custom content | HTML content (that may contain JavaScript, CSS, and double-bracketed interpolation objects within its HTML tags). This content is added below the contents of the field or within the field group, below all fields. Example:<p>Concatenated string is: {{startingPointData.Word1}}{{startingPointData.Word2}}.</p> |
CSS class names | One or several space-separated CSS class names defined in CSS/LESS or Global CSS/LESS tab. (Do not use periods before class names in this field.) Example: |