Skip to main content

Expansion panel element

Level: beginner

Use the Expansion panel element to place the page components into multiple sections. Unlike the Area element, the Expansion panel element can be expanded. The Expansion panel element adapts the content based on the device type. Mobile Creatio displays single column for mobile phones and two for tablets.

View the example of a configuration object that places page components into multiple sections below.

Example of a configuration object that places page components into multiple sections
{
"type": "crt.ExpansionPanel",
"title": "Job experience",
"items": [
{
"type": "crt.DataGrid",
"items": "ContactCareerDetailV2EmbeddedDetail",
"verticalScroll": false,
"columns": [
{
"code": "Job",
"sticky": true,
},
{
"code": "Account",
"caption": "My account",
"width": 200,
}
]
}
],
"tools": [
{
"type": "crt.Button",
"icon": "add-button-icon",
"iconPosition": "only-icon",
"color": "default",
"size": "medium",
"clicked": {
"request": "crt.CreateRecordRequest",
"params": {
"entityName": "ContactCareer",
"defaultValues": [
{
"attributeName": "Contact",
"value": "\$Id"
}
]
}
},
"visible": true,
"clickMode": "default"
}
],
"name": "ContactCareerDetailV2EmbeddedDetail"
}

string type

Element type. crt.ExpansionPanel for the Expansion panel element.


string title

Localizable title of the Expansion panel element.


array of objects items

The array of nested Freedom UI Mobile components.

Parameters

value

The name of attribute from the viewModelConfig schema section.

type

Type of nested component.


array of objects tools

List of nested Freedom UI Mobile components. For example, buttons. Nested components are displayed in the top right of the Expansion panel element.

Parameters

type

Type of nested component.

text

Name of nested component.


boolean expanded

The flag that determines whether to expand an element. By default, true.

Available values

true

An element is expanded.

false

An element is collapsed.