Display Conditional HTML Repeat Headers For Specific Status Value

This guide will show you how to display conditional HTML Repeat headers based on specific status values.

  1. Initial Setup:
  • Drag and drop an “HTML” field, two “Text” fields, an “Email” field, a “Hidden” field, a “Select” field, and a “Field Update Workflow” field inside a “Repeat“ field on your form. Rename these fields as needed.
image
image
  1. Configuring The “Select” Field:
  • Click the pencil icon of the “Select” field.
  • Update the “Select Options” as shown below.
image
  1. Configuring The “Field Update Workflow” Field:
  • Click the pencil icon of the “Field Update Workflow” field.
  • Set “Rule Criteria” to ‘Status (Select field) || not equal to || Open’.
image
  • Set “Field Updates Success” to ‘Status Color CSS (Hidden field) || value || danger’.
image
  • Set “Field Updates Fail” to ‘Status Color CSS (Hidden field) || value || primary’.
image
  1. Configuring The “HTML” Field:
  • Click the pencil icon of the “HTML” field.
  • Paste the code provided.
image
  • Use this code.
  • “8b8d-c720-2332” is the field ID of the “Status Color CSS” Hidden field.
  • “d582-380d-0a29” is the field ID of the “First Name” Text field.
  • “d4c6-ee4d-1fa0” is the field ID of the “Last Name” Text field.
  • “f88f-9789-486e” is the field ID of the “Email” field.
<span class="label label-{{8b8d-c720-2332}}">{{d582-380d-0a29}} {{d4c6-ee4d-1fa0}}</span>
<small>{{f88f-9789-486e}}</small>
  • Set yes to the “Enable the Reload On Merge Field Change” option.
  • Set yes to the “Enable Advances Templating” option.
image
  1. Configuring The “Repeat” Field:
  • Click the pencil icon of the “Repeat” field.
  • Set “Custom Repeat Header HTML” as the “Repeat Entry Header Fields”.
  • Save the changes.
image
  1. Test The Form:
  • The Repeat entry header will display based on the "Status" value.
image

For any questions, please contact us - [email protected] or the Formyoula in-app chat. 🙂