Container Validation

Background Information

You can use a container's isValid property to check the input validation for all controls inside the container.

This is easier as it is no longer necessary to mention each control individually when building your app.

In this example we will build a simple form with five controls inside a single container:

• Two textboxes: one called Name, and a second one called Email (input type Email).
• One datepicker called Date of birth.
• One dropdown list called Area.
• One button called Submit.

Steps

1. Open your already existing application or start a new one.
2. Add a container to your app.

3. Add a Textbox control inside the container.

   • Rename it Name and add Name in the Label property.
   • Add =true in the Required property.

4. Add a Datepicker control inside the container.

   • Rename it Date of birth and add Date of birth in the Label property.

5. Add a second Textbox control inside the container.

   • Select Email as Input type.
   • Rename it Email and add Name in the Label property.
   • Add =true in the Required property.
   • Add @company.com in the Allow domain property.

6. Add a Dropdown control inside the container.

   • Rename it Area and add Name in the Area property.
   • Add the following in the List source property: =["rural", "urban"].
   • Add =true in the Required property.

7. Add a Button control outside the container.

   • Rename it Submit.
   • Add the following in the Disabled property: !Container.isValid.

Procedure Results

After following all the steps above, you can preview your app.

While previewing the app, the Submit button is disabled. The button is only enabled when the Name,Email (including the correct @company.com domain), and Area fields are filled in.