Skip to main content

Validation Groups

In a web application, when dealing with forms, there will be a need to validate different sets of fields separately. For instance, a registration form may include personal information and payment information, each requiring different form validations to trigger for different UI events.

Validation groups help manage and validate specific sets of form fields independently, allowing for more structured and modular form validation.

By leveraging validation groups, users can efficiently manage form validation, state tracking, and dynamic UI interactions

How Validation Groups Work​

  1. Grouping Fields: Design group of related fields that belong to a specific validation group.
  2. Applying Different Validation Rules: Each group can have its own validation rules.
  3. Validating Groups Separately: Trigger validation for a particular group without affecting other sections.
  4. Conditional Validation: Validate different groups based on user interactions (e.g., validating personal info before proceeding to payment).

Key Benefits​

  • Improved User Experience – Users can fix errors in one section without affecting others.
  • Modular Validation – Separates validation logic for different parts of the form.
  • Dynamic Form Handling – Enables step-by-step validation in multi-step forms.
  • Custom Error Messages – Different error messages for different sections.

Example Use Case: Registration Form

Form Sections

  1. Personal Information (Name, Email, Phone)
  2. Payment Information (Card Number, Expiry Date, CVV)

Each section should be validated separately so the user can fix errors in one without being blocked by another.

Create Validation Groups​

Follow the steps given below to create a validation group:

  1. From Explorer, right-click Validation Groups in an interface (or) master layout (or) component and select Add.
  2. In the properties panel, configure the below properties as necessary and click save. The "Validation Group added successfully" message appears upon successful creation.
PropertyDescriptionComments
Name*Provide the name of Validation Group.The Validation Group Name is a unique identifier that helps differentiate between various validation groups within a form. It allows developers to categorize form fields based on different validation rules.
Id*Provide an unique identifier.By default, id is automatically generated.

Note: An asterisk (*) denotes that the property is mandatory for creating a validation group.

Using Validation Groups​

Grouping Containers Under a Validation Group​

The following UI containers can be grouped under a Validation Group to control validations, state checks, and enable/disable actions:

  • Section
  • Panel
  • Card
  • Row
  • Entire Form

Steps to Assign a Widget to a Validation Group​

  1. Navigate to the widget.
  2. Expand the Additional Configuration section.
  3. Select the desired Validation Group Name from the ValidationGroup dropdown.
  4. Click Save to apply the changes.

Executing Actions on a Validation Group​

Validation groups allow various actions to be performed dynamically through event handlers.

Steps to Trigger Actions on a Validation Group:

  • Navigate to the event handler that should execute based on a specific UI event.
  • Choose one of the following actions to be performed on a validation group:
    • Run Validations – Executes form validations for selected validation groups or the entire form.
    • Form Dirty Check – Checks if the form has unsaved changes within a validation group or the entire form.
    • Clear Dirty – Resets the dirty flag, marking the form as clean.
    • Enable Form Groups – Enables widgets within a specific validation group or the entire form.
    • Disable Form Groups – Disables widgets within a specific validation group or the entire form.
  • Double-click on the corresponding construct element to apply the desired action.
PropertyDescriptionComments
LabelProvide the label for the Construct element.-
Form SectionDropdown with two options: Whole Form: If selected, action is performed on the entire form. Individual groups: Select if action is to be performed on the selected Validation Groups.By default, Whole Form is selected
Validation GroupsMulti-select dropdown allowing multiple validation groups to be selected. Action is to be performed on the selected Validation Groups.Validation groups related to the specific interface or master layout will be loaded in the Validation Groups dropdown.