...

The easiest way to see how the Subform works is to use the existing built-in App Expenses Claims. Here are the steps:

...

1. Start the Joget Server  and open the  App Center.
   
   
2. Log in as  admin  and click on the pencil icon on the  Expenses Claim  to open the  Design App. (see Figure 1)
   
   Image Added
   Figure 1
   
   
3. Click on

...

1. Expense Claim Form  and you will be directed to the

...

1. Form Builder. 
   
   

2. Hover the mouse over the Expense Claim Details section and click on Edit to open up the Edit Subform properties.

...

1. 
   
   

2. Take note in the Form field that is set to Expense Claim New form. (see Figure 2)
   

   Image Added
   Figure 2
   
   

3. Click on Preview and notice that the first section displayed is the Expense Claim New Form.

...

^{Image Removed}

^{Figure 1}

^{Image Removed}

...

Subform Properties

Edit Subform

Name	Description

Screen (Click to view)

ID	Element ID. Since the subform is not an input field, one may leave it as it is. Please see Form Element for more information about defining the ID and list of reserved IDs.

Image Removed

Label	Subform label.
Form	Form to be loaded as Subform.

Image Added

UI

Image Added

Data & Binder

Image Removed

Name	Description	Screen (Click to view)
Parent Field to keep Subform ID	The ID of the field in the parent form to store the SubForm table's primary key. SubForm data will be loaded based on the record ID retrieved from this field.
Subform Field to keep Parent ID	The ID of the field in the SubForm form to store the parent table's primary key.
Load Binder	By default, the Workflow Form Binder plugin is used for loading and storage of form data in the subform, you may override it with other plugins. See the list of available Form Binder.
Store Binder	By default, the Workflow Form Binder plugin is used for loading and storage of form data in the subform, you may override it with other plugins. See the list of available Form Binder .

Image Added