Dynamic Pages

The goal is to create dynamic forms where certain pages can be accessed or restricted based on specific answers given within the form. This allows for a more customized and interactive form-filling experience.

Uses

To make page dynamic, include it with the following specifications:

Properties

Required properties

• header: Title/header of the page.
• instructions: Guidelines or instructions for filling out the form on this page.
• fields: An array of field objects representing components on the page.

Optional properties

• enabled: Specifies whether the page is enabled or restricted. It can be either a boolean or an array of evaluation conditions. By default, the page is enabled.
• enabled_operator: Specifies the operator used to combine conditions for enabling the page when the "enabled" property is an array. The values can be and or or, and the default operator is or.

Enabled Property

• boolean: true/false to enable/disable the page.
• array: Each condition within the "enabled" array is used to dynamically enable or disable the page based on certain criteria.

Evaluation condition

• condition: if, not if, overlaps, regex
• variable: The variable within the form from previous pages. It can be an array or a scalar value.
• value: The value to compare against the variable. It can be a single value or an array for multiple values. In case of regex condition, it is a regular expression pattern to match against the variable. It can be any valid regular expression.

Example

{
  "component_name": "form_builder",
  "pages": [
      {
          "header": "Sample",
          "instructions": "Sample",
          "fields": [{
            "id": "select_tags",
            "title": "test",
            "component": "text_input",
            "default_value": "test"
          }],
          "enabled": true // false
      },
      {
          "header": "Sample Resticted",
          "instructions": "Sample Restricted",
          "fields": [],
          "enabled_operator": "and", // or 
          "enabled": [
             {
               "condition": "if",
               "variable": "select_tags",
               "value": "abc"
             }, {
               "condition": "not if",
               "variable": "select_tags",
               "value": ["abc", "123"]
             }, {
               "condition": "overlaps",
               "variable": "select_tags",
               "value": "abc"
             }, {
               "condition": "regex",
               "variable": "select_tags",
               "value": "*"
             }
           ]
      }
  ],
  "data_token": {}
}

Note: This example demonstrates the usage of the Form Builder with conditions for enabling or restricting pages based on specific input values.