Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

The subform form consists of a hidden field as a Foreign Key to connect both Parent and Subform forms, elements depending on the use case, and two Custom HTML elements to wrap the Subform Repeater in a container and script to detect changes.

Figure 1: Subform Configuration


Wrap the elements in a div class in the first Custom HTML element using the HTML code below.

Image Modified

Figure 2: Wrap Elements in Div Class


Code Block
languagexml
<div class="link-container" style="padding-left:30%;"></div>

...

The second Custom HTML will handle any changes made in the original text and will create a new link based on the new text entered.

Figure 2: Script to Detect Changes and Create New Link


Below is the script used:

...

In the Parent form, we only need the Subform Repeater Element. Set the id as 'SR' following the code above and point to the subform form created.

Figure 3: Subform Repeater in the Parent Form

Runtime

Enter text in the URL field and click save. A URL based on entered text will appear underneath the URL field.

Figure 4: Runtime Test


Changes made in the new row won't disturb the previous row.

Figure 5: Test in New Row

Related Documentation

  1. Read more about Subform Repeater Plugin

Source Code and Plugin Download

  1. You can find the latest release at https://github.com/jogetoss/subform-repeater.
  2. Upload the plugin to your Joget by navigating to Settings > Manage Plugins > Upload Plugin as admin.

Demo App Download

View file
nameAPP_kb_dx8_detectChange_sr.jwa
height250