Introduction

The section is the placeholder to hold Form Elements.

Each section has one column in it by default.

Get Started

To see how Section works, the default bundled Expenses Claims app will be used for this example.

Start the Joget Server and open the App Center.
Log in as admin and click on the pencil icon on the Expenses Claim to open the App Composer (see Figure 1).

Figure 1
Click on Expense Claim New and you will be directed to the Form Builder.
Click on the Section element to open the Configure Section properties.
To add a new section, click on the plus icon below the section (Figure 2)

Knowledge Base for DX 8 > Section > configure-section-properties.png

Figure 2

Section Properties

Configure Section

Knowledge Base for DX 8 > Section > configure-section.png

Name	Description
Label	Section label.
ID	Element ID. Since the section is not an input field, it is optional to change this. Please see Form Element for more information about defining the ID and list of reserved IDs.
Readonly	Determines if the element is editable.
Display Field as Label When Readonly?	Displays the value of the element as plain text when an element is set to "Readonly".

Data

Knowledge Base for DX 8 > Section > section-data-binder.png

Name

Description

Load Data From

Optional by default. When it is not set, it will use the parent's data store. You may override this behavior by using its own designated data store by defining it.

Available options:

Beanshell
Database SQL Query
Database Wizard
Default
Directory
JSON API
Parent Form Data Store

Save Data To

Optional by default. When it is not set, it will use the parent's data store. You may override this behavior by using its own designated data store by defining it.

Available options:

Beanshell
Database SQL Query
Database Wizard
Default
Directory
JSON API
Multi Store data stores
Parent Form Data Store

Advanced Options

Visibility

There are several feature enhancements for Joget DX version 8.1 onward. It is explained below.

This applies to Joget DX version 8.1 onwards

Improve the UI to add parentheses/grouping in the visibility control rule.
Support more Operators/Operation

Download this app to see this new feature in action : APP_kb_dx8_testSection.jwa.

Knowledge Base for DX 8 > Section > chrome_94AyKgUjxh.png

Name

Description

Visibility Control Rules

Sub-element

Description

Join Type

Available options:

AND
OR

Reverse Value

Knowledge Base for DX 8 > Section > image-2024-5-2_10-49-47.png

Equivalent of a NOT operator.

Field ID

The field ID of a form element to control the visibility of this section.

You can look up into a subform field value to control visibility on your current (parent) form.

subformId.status

Operators/Operation

Knowledge Base for DX 8 > Section > image-2024-5-2_10-55-36.png

Equal To : Field value and compare value are equal. Compare for both string and number.
Greater Than : Field value is greater than compare value. Compare for both string and number.
Greater Than Or Equal To : Field value is greater than or equal to compare value. Compare for both string and number.
Less Than : Field value is less than compare value. Compare for both string and number.
Less Than Or Equal To : Field value is less than or equal to compare value. Compare for both string and number.
Is True : Field value is true or 1
Is False : Field value is false or 0
Contains : Field value is containing a compare value as substring
List Contains : Field value is a semicolon delimited string which contains compare value as 1 of the delimited value.
In : Field value is one of the value of semicolon delimited string in compare value.
Regex Match : Field value is matching the regex in compare value.

Field Value

Show the visibility of this section, when this field value is present in the field ID defined above.

This applies to Joget DX version 8.0.12 and before.

Knowledge Base for DX 8 > Section > section-visibility.png

Name

Description

Visibility Control Rules

Sub-element

Description

Join Type

Available options:

AND
OR

Reverse Value

Equivalent of a NOT operator.

Field ID

The field ID of a form element to control the visibility of this section.

You can look up into a subform field value to control visibility on your current (parent) form.

subformId.status

The Field ID supports the use of parenthesis ( ), to group multiple conditions.

To see this in action, try out this sample app here: APP_booleanTest-sample.jwa

Field Value

Show the visibility of this section, when this field value is present in the field ID defined above.

Approved1|Approved2|Approved3

Using Regular Expressions?

In "Field Value", you can use Regular Expression.

Permission

Knowledge Base for DX 8 > Section > section-permission.png

Name

Description

Permission

Manage the permission on who to see this section. See Permission Control.

Available options:

BeanShell
Controlled By Manage Permission Menu
Department
Group
Is Admin
Is Anonymous
Logged In User
Multi Permissions
Organization
Plugin Template - Permission
User

Show as Readonly When No Permission?

Displays the value of the element as plain text when a user's permission is denied.

Development

Knowledge Base for DX 8 > Section > section-development.png

Name	Description
Comment	Appends a helper text beside this section when in the form builder, to help app designers identify the section.

Download Demo App

APP_booleanTest-sample.jwa
APP_kb_dx8_testSection.jwa.