> For the complete documentation index, see [llms.txt](https://docs.eximee.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.eximee.com/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/0-struktura-i-nawigacja/sekcja-section.md).

# Section - Section

A section component for grouping other components.

![](https://content.gitbook.com/content/2CssJT0zIo4SJQLbSZ6l/blobs/kD2gjION4QLRjFVTB4J2/18s_files/image2025-5-14_14-10-34.png)

✅ **When to use:**

* You want to group other components into a logical block (e.g. personal data).

:x: **When not to use:**

* It is only a simple separator without grouping content. **Use**: [HorizontalLine](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/0-struktura-i-nawigacja/linia-horizontalline.md).
* There should be an option to enter the same type of data multiple times (e.g. children’s data). **Use**: [Repeatable section](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/7-komponenty-specjalne/sekcja-powtarzalna-repeatablesection.md).

## Component properties

<table><thead><tr><th>Eximee Designer property</th><th width="180.88330078125">Attribute name in Source</th><th>Description</th></tr></thead><tbody><tr><td><strong>Title</strong> (section <strong>Basic properties</strong>)</td><td>title</td><td>Section title. It is possible to reference variables or fields in the section title, e.g. <em>${sessionVariableName}</em> or <em>${GesTextField1}.</em></td></tr><tr><td><strong>Collapsible section</strong> (section <strong>Other</strong>)</td><td>foldable</td><td><p>Specifies whether the section should be collapsible. Default is "false" - not collapsible.</p><p>Availability of the functionality depends on the license and may not be available in all deployments.</p></td></tr><tr><td><strong>Section collapse condition</strong> (section <strong>Other</strong>)</td><td>foldedCondition</td><td><p>Section collapse condition - if it is met, the section is collapsed. For <strong>presentation</strong>=STANDARD the condition is evaluated at the very beginning and is used only for the first display of the section. For <strong>presentation</strong>=LABELS changing the condition value causes the section to be modified (collapsed and expanded) while the application is displayed.</p><p>Availability of the functionality depends on the license and may not be available in all deployments.</p></td></tr><tr><td><strong>Graphical representation of the field</strong> (section <strong>Other</strong>)</td><td>presentation</td><td><p>Defines the way section expansion/collapse is presented. Available collapse/expand presentation types: STANDARD and LABELS (more details below). Availability of the functionality depends on the license and may not be available in all deployments.</p><p>Availability of the functionality depends on the license and may not be available in all deployments.</p></td></tr><tr><td><strong>Dynamic section title</strong> (section <strong>Other</strong>)</td><td>sectionDynamicTitles</td><td>Allows you to define section titles that depend on conditions. The first title in order whose condition is met will be displayed. If none of the conditions is met, the title provided in the property is displayed <em>title.</em> It is possible to reference variables or fields, e.g. <em>${sessionVariableName}</em> or <em>${GesTextField1}.</em></td></tr><tr><td><strong>Technical section</strong> (section <strong>Other</strong>)</td><td>technicalSection</td><td>Disables grouping of fields in the section (does not add elements <em>fieldset</em> and <em>legend</em>). This avoids excessive grouping in the HTML structure, which makes it easier to adapt the form to WCAG requirements.</td></tr></tbody></table>

\> More information about component properties: \[Common component properties]\(../../../praca-z-komponentami-bazowymi/wspolne-wlasciwosci-komponentow\.md)

## Component dependencies in the section

When the value of the component on which the section depends changes, the state of the section and all components inside it is recalculated.

When any component in the section changes, the values of all components that depend on it are recalculated.

## Component layout (layout)

A layout can be defined on the section analogously to the layout for the application page (more in: [Changing component widths (layout)](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/praca-z-komponentami-bazowymi/zmiana-szerokosci-komponentow.md)).

## Dynamic section title data

The section title can be dynamically populated, for example using session variables. If in the property *title* we enter a session variable in the form `${sessionVariableName}` then the section title will take the value of the session variable and every time the value of that variable changes, the section title will also change.

Another way to dynamically populate the section title is to use the property **Dynamic section title** ([Section - dynamic section titles](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/0-struktura-i-nawigacja/sekcja-section/sekcja-dynamiczne-tytuly-sekcji.md)). In the displayed window, each subsequent title is added by clicking the button **Add dynamic section title**. In the column **TITLE KEY** you should enter the key previously defined in the **Translations** tab. The key value will be displayed automatically in the column **PREVIEW**. The condition is defined according to the description in [Advanced condition editor](/documentation/documentation-en/budowanie-aplikacji/logika-biznesowa/jezyk-wyrazen-definiowania-warunkow-warunki-z-getvalue/zaawansowany-edytor-warunkow.md).

<figure><img src="https://content.gitbook.com/content/2CssJT0zIo4SJQLbSZ6l/blobs/neTpRfUGY4eUxDEuE8kF/18s_files/image2023-2-6_14-53-35.png" alt=""><figcaption><p><em><strong>Figure 1.</strong> Window for defining conditional section titles.</em></p></figcaption></figure>

In the property **Dynamic section title** conditions are defined for when the section title should change. If the condition `getValue("@GesCheckbox1")=="Y"` is met (i.e. Checkbox1 takes the value Y - is selected), then the section title will take the value (**PREVIEW**) specified for the defined key **TITLE KEY** (i.e. in this situation, meeting the condition sets the section title to *"Title changed after clicking ..."*). If the condition is not met, the title specified in the property will be displayed **Title**.

<figure><img src="https://content.gitbook.com/content/2CssJT0zIo4SJQLbSZ6l/blobs/V7idrS5bSxlk4wHT6JJC/18s_files/image2025-5-15_8-40-34.png" alt=""><figcaption></figcaption></figure>

<figure><img src="https://content.gitbook.com/content/2CssJT0zIo4SJQLbSZ6l/blobs/5OmRdsiCYWssFdex27PT/18s_files/image2025-5-15_8-41-5.png" alt=""><figcaption><p><em><strong>Figures 2 and 3.</strong> Dynamic section title data - preview on the application.</em></p></figcaption></figure>

## Section with collapsible/expandable option

{% hint style="info" %}
Availability of the functionality depends on the license and may not be available in all deployments.
{% endhint %}

Two types of collapse/expand presentation are available for the section (property **Graphical representation of the field**):

* **STANDARD** - section collapsed/expanded using a button located at the end of the section

<figure><img src="https://2112972046-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2CssJT0zIo4SJQLbSZ6l%2Fuploads%2FLbpzZLtejlzoQrs73Doc%2Fimage2018-9-4_15-58-41.png?alt=media&amp;token=574c1b04-444d-49f8-90af-5641eecc8e7e" alt="" width="563"><figcaption></figcaption></figure>

* **LABELS** - section (without a title!) collapsed/expanded using the text set in **Section collapse/expand button label**.

<div data-with-frame="true"><figure><img src="https://2112972046-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2CssJT0zIo4SJQLbSZ6l%2Fuploads%2Ft93P1MoEhUHAJql1H936%2Fimage2018-9-4_16-1-40.png?alt=media&amp;token=f2608fea-79c2-4235-8ece-46c4e65c8a80" alt="" width="563"><figcaption></figcaption></figure></div>

{% hint style="info" %}
If a validation error occurs on components inside a collapsed section, the user will not be notified in any way and will also not be able to move to the next page. It is the application designer’s responsibility to provide an appropriate validator on the page.
{% endhint %}

{% hint style="info" %}
Demo application: demoSection
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.eximee.com/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/0-struktura-i-nawigacja/sekcja-section.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.