Subform

The SubForm element is integral in completing a typical process flow in Joget. It enables you to display another form within a form without limit on the nesting depth.

How does it work?

To see how the SubForm works, follow these steps using the built-in App Expenses Claims:

1. Start the Joget Server and open the App Center.
2. Log in as admin and click the pencil icon on the Expenses Claim to open the App Composer.
   
3. Click Expense Claim Form to be directed to the Form Builder.
   
4. Click the Expense Claim Details section to open the Configure Subform properties.
5. Take note of the Form field set to Expense Claim New form.
   
6. Click Preview and notice that the first section displayed is the Expense Claim New Form.
   

Configure subform 

The SubForm configuration allows you to integrate and display another form within a parent form. This section will guide you through the necessary settings to effectively use SubForm elements in your applications.

Here is an explanation of each field in the subform element:

• Label: Subform label to be displayed to the end-user.
• ID: Element ID. Since the subform is not an input field, this can be left as is. See Form Element for more information about defining the ID and the list of reserved IDs.
• Form: Form to be loaded as Subform.

UI

UI settings for the SubForm element help you customize the user interface and control how the subform is displayed within the parent form.

General

General settings for the SubForm element include options that affect its overall behaviour and display properties.

The following explains the configuration fields for the SubForm in the UI - General sections:

• Readonly: Determines if the element is editable.
• Display field as Label when readonly?: Displays the value of the element as plain text when the element is set to Readonly.
• Display without frame?: Decorator option. It removes the default styling applied to SubForm when checked.

Data

Data settings for the SubForm element include data linkage and data store configurations. These settings control how data is shared between the parent form and the subform, as well as how data is retrieved and stored.

Data linkage

Data linkage settings ensure proper data synchronization between the parent form and the subform. This includes setting up fields that maintain the relationship between the two forms.

The following explains the configuration fields for the SubForm in the Data section - Data linkage settings:

• 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.

Data store

Data store settings control how data is loaded and stored within the subform. You can use the default plugins or override them with custom options to suit your needs.

The following explains the configuration fields for the SubForm in the Data section - Data store settings:

• Load Data From: By default, the Workflow Form Binder plugin is used for loading and storing form data in the subform. You may override it with other plugins. See the list of available Form Data Store.
• Store Data To: By default, the Workflow Form Binder plugin is used for loading and storing form data in the subform. You may override it with other plugins. See the list of available Form Data Store.