Skip to main content

Text List

Use it when multiple items are available or can be selected for only one input.

There are multiple combinations possible with this component depending on:

  • Single / Multi: Single value or multiple values are accepted
  • Static / Rest: Data comes with the definition or data need to be queryed
  • Full / Id: When new item is selected data stores the ID attribute or Full item data

Example

Loading...

Properties

General

AttributeTypeDescriptionCategory
Model Id RequiredString

This is a unique id for the component.

Every field on a form model needs a unique ID, which is automatically generated but can be changed if needed (e.g. to reference in expressions or for debugging purposes).

If the field type supports rendering a label, and most types do, it can be configured here. This label is a displayed on the form to the end user and typically indicates what value is expected in the field.

The documentation property holds free-form text that can be used to give more details about this text list, like its purpose, usage in other models, etc.

Label Expression usage possibleTranslatable to different languagesText

The label attribute adds a label to the component.

Label position Selection:
  • Left
  • Top

The position of the label, you can choose between left or top.

Label tooltip Expression usage possibleTranslatable to different languagesText

When it is defined, a question mark icon will appear in the component label. When the user hovers over it it will show this text in a tooltip.

Documentation Multiline Text

A free-form text to explain the use cases for this form field.

Value RequiredExpression usage possibleText

The binding for the form field. Use an appropriate expression to bind the component to its value and specify where the value is written/read. For example, use '{{myVariableName}}' to store the value of the field in a variable named 'myVariableName'. Use prefixes to define the scope of the value, for example, 'root.' for referencing the root case/process to store the value in. Please refer to the section 'Frontend expressions' in the Flowable guide for more information.

The purpose of a form is to either display some value or to have users provide values for the various fields of a form.

In both situations, this value needs to be bound to an identifier using the {{myValue}} notation, and the value provided by the user will be stored in a variable with that identifier.

If there already was a value bound to the identifier before, for example because another form had a field bound to the same identifier, it will be displayed.

Default value Expression usage possibleText

If the value is not set, the default value will be used.

Placeholder Expression usage possibleTranslatable to different languagesText

A text that appears in the input box when it has no value.

Tab Index Integer

Determine their relative ordering for sequential focus navigation. Tab index will be ignored if the component is inside a subform.

Datasource

AttributeTypeDescriptionCategory
Data source Selection:
  • Static
  • REST
  • Master
  • Data Object

Options to select different types of Data source.

The datasource of the text list configures where the data options available to the user originate from. The source can be statically defined or dynamically populated from a third party service.

Items Expression usage possibleTranslatable to different languagesList

When using a 'static' datasource, the items need to be defined. If no values are shown, make sure you have configured the 'columns' property, as the items are defined by giving values for the different columns.

Master Data Key RequiredExpression usage possibleText

Key representing the Master Data Type. e.g., 'md-country'.

Include Translations Boolean

Flag indicating whether master data instance translations should be included in the fetched data.

Query URL RequiredExpression usage possibleText

URL to request the items with optional variables.

$searchText: Text the user typed if the component allows search.

$start: First item index (for pagination).

$pageSize: Number of items per page.

eg. /rest/users?start={{$start}}&size={{$pageSize}}

Path Text

When using a REST data source, this is the location in the response data to get the row collection.

Data object model Requireddataobjectselectsearch

Defines which type of data object data is returned when using the select and which operation is used.

Query Parameters List

The query parameters that should be added to the Query URL.

$searchText: Text the user typed if the component allows search.

$start: First item index (for pagination).

$pageSize: Number of items per page.

eg. /rest/users?start={{$start}}&size={{$pageSize}}

Query parameters will be added to the REST requests that are executed when data is fetched to display in the text list.

Navigation URL Expression usage possibleText

The URL to navigate to for the selected item. The URL might contain expressions, most likely at least '{{$item.id}}' in order to include the ID of the selected element in the navigation URL.

Advanced configuration options of the datasource. Please check the tooltips on each property for more information.

Target Expression usage possibleText

Specifies the target for the navigation URL, use '_blank' to open the selected item in a new window or '_self' to use the same window for navigation.

Validation

Validation

AttributeTypeDescriptionCategory
Required Expression usage possibleBoolean

The required flag specifies if entering a value for the component is mandatory.

Providing proper data in form fields is important, especially when in process, case, decision or any other models the values provided in the form fields are used in subsequent steps.

To make sure that the data is correct, validation is crucial. For this reason, a form can only be submitted when all fields are valid and thus all validation properties configured on the left apply.

Check the tooltips on the properties for more information.

Validation Panel Display Selection:
  • Show
  • Only message
  • Hide

Display at validation panel and validation tooltip.

Minimum elements Expression usage possibleInteger

When Multi-selection is enabled, it specifies the error message shown if the number of items selected is lower than the minimum specified in validation.

Maximum elements Expression usage possibleInteger

When Multi-selection is enabled, it specifies the maximum number of items to be selected.

Custom validations List

List of additional validations to apply.

The text list can have custom validation rules beyond the standard set of validations. Such a rule is written as a frontend expression in the form of {{myExpression}}. If this expression evaluates to false, the submission of the form won't be possible.

Validation messages

AttributeTypeDescriptionCategory
Minimum items error message Expression usage possibleText

Custom error message for maximum items validation.

If there any validation rules configured for this text list, an error message will be displayed to the user when the field is deemed invalid.

This error message can be customized. Make sure to choose the matching error message property for the particular validation rule property you want to customize the message for.

Maximum items error message Expression usage possibleText

Custom error message for minimum items validation.

Rendering

AttributeTypeDescriptionCategory
Description Expression usage possibleTranslatable to different languagesText

The description attribute adds a description to the component.

Some field types have an extra line of text displayed to give the user more details about the field.

Ignored Expression usage possibleBoolean

If true the component will be hidden and the value will not be part of any payload.

Fields can also be shown or hidden based on the visible condition. This can be a frontend expression in the form of {{myExpression}} which can reference other form field values by their IDs.

Fields can also be enabled or disabled, and similarly this can be made dynamic based on a frontend expression.

Some field types can be ignored (the property is shown here if that's the case), which means that its value won't be taken into account.

Visible Expression usage possibleBoolean

Boolean value or expression specifies whether the component is visible or hidden. This expression might include another value in the same form, for instance use a checkbox bound to {{showAdditionalFields}} and use the very same expression as the visible attribute to show or hide the component according the checked state of the checkbox. If you want to only show the component, if the form is not used as the init-form, you can use the expression '{{root.id}}' which evaluates to true only, if there is a current case id which is not the case in an initialization form.

Enabled Expression usage possibleBoolean

Boolean value or expression specifies whether component is enabled or disabled.

Style class Text

Stylesheet class name. Add any style classes to be applied to the component for the desired styling and rendering.

The text list can get customized CSS classes to customize the default styling. Note that the CSS files needed for the customizations must be available on the runtime system.

Advanced

AttributeTypeDescriptionCategory
Events List

The text list emits low-level events on which can be reacted with a frontend expression to implement various use cases that are not possible with regular modeling.

If the expression produces a value, it can be stored in a new variable using the Result variable property.

List Attribute Details

Items

AttributeTypeDescription
Value Expression usage possibleText

The binding for the form field. Use an appropriate expression to bind the component to its value and specify where the value is written/read. For example, use '{{myVariableName}}' to store the value of the field in a variable named 'myVariableName'. Use prefixes to define the scope of the value, for example, 'root.' for referencing the root case/process to store the value in. Please refer to the section 'Frontend expressions' in the Flowable guide for more information.

Query Parameters

AttributeTypeDescription
Name RequiredExpression usage possibleText

The name of the query parameter

Value RequiredExpression usage possibleText

The value of the query parameter. The value will be automatically URL-encoded.

Default Value Expression usage possibleText

The default value for the query parameter (in case the value didn't return anything). The value will be automatically URL-encoded.

Custom validations

AttributeTypeDescription
Expression RequiredExpression usage possibleText

Validation passes when this expression is true.

Error message RequiredTranslatable to different languagesText

Message to display when the validation fails.

Events

AttributeTypeDescription
Event label RequiredText

This is a unique id for the component.

Event type Selection:
  • On value change

The type of event emitted by the form field.

Expression Expression usage possibleText

Validation passes when this expression is true.

Result variable Text

Capture the result of the expression in a result variable.