(Example) How to use a Validation Mask in a Form Control

This example shows how to use a validation mask in a form control.

Background and Setup

Prerequisites

Good to Know

  • Travel Reimbursement is an app that requests reimbursement for your official travel expenses. This app provides a Travel Reimbursement form to enter the details of the travel.

    For the use case in this example, configure a validation mask in the Travel Reimbursement form to make sure the value entered in the email address field is in valid email address format.

Step 1: Create a Validation Mask

First, create a validation mask in Manage Center.

How to Start

  1. Click Manage.

    Click Manage
  2. In the Manage Center, click App Builder > eForms Settings.

    Click eForms Settings
  3. On the eForms Settings screen, click Validation Mask.

    Click Validation Mask
  4. On the Validation Mask screen, click Add Validation Mask.

    Click Add Validation Mask

Procedure

  1. On the Add Validation Mask screen, in the Name field, enter EmailAddress.

    Create Validation Mask Enter Name
  2. In the Value field, enter this value:

    /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/.


    Create Validation Mask Enter Value
  3. Click Save.

    The Validation Mask screen shows the EmailAddress validation mask.


    Create Validation Mask Screen

Step 2: Add a Validation Mask to a Form Control

Next, add a validation mask in the form control Travel Reimbursement form.

How to Start

  1. Click App Builder.

    Click App Builder
  2. On the App Builder Home screen, click All Apps.

    Click All Apps
  3. On the All Apps screen, on the Travel Reimbursement app, click Edit Edit icon.

    Click Edit
  4. On the App Details screen, hover over the Travel Reimbursement Form, and click Edit Edit icon.

    Click Edit

Procedure

  1. On the Travel Reimbursement form, put your cursor over the Email form control, and the form control toolbar shows.

    Validation Mask form control
  2. Click Edit Properties Edit Properties icon.

    Edit Validation mask form control
  3. On the Field Settings - Text Box screen, click the Advanced tab.

    Advanced tab
  4. On the Advanced tab, in the Validation Mask list, select EmailAddress.

    Select Validation Mask

    When you select the Validation Mask field, the Validation Format field completes by default based on the selected validation mask.


    Validation Format
  5. On the Configure tab, in the Text Box Validation Message field, enter Enter the ${L} in valid email address format.

    Configure tab
  6. Click Close.

Step 3: (Optional) Test the Validation Mask

Next, test the validation mask in the Travel Reimbursement Form.

Procedure

  1. Click Preview Perspective View icon > PC Browser PC Browser icon.

    PC Browser

    The Travel Reimbursement form opens in a new browser tab.


    Travel Reimbursement form RunTime
  2. On the Travel Reimbursement form, in the Email field, enter an email address that is not in valid email address format.

    Travel Reimbursement form invalid Email address
  3. Enter an email address that is in valid email address format. No error shows.

    Travel Reimbursement form valid Email address

Step 5: (Optional) Run the App

Next, run the app.

For more information, refer to My Apps screen

How to Get the App

This example is based on the Travel Reimbursement app from the AgilePoint NX App Store. Use this procedure to get the app..

Good to Know

  • This procedure is optional. It is provided so you can test the example with an out-of-the-box app.
  • This is part of the Background and Setup procedures, but many users preferred this step to appear after the example, not before it.

Get the App

  1. Click App Store.

    App Store
  2. Click Filter

    App Store screen
  3. In the CATEGORY section, click Finance.

    App Store screen
  4. Click the Travel Reimbursement app.

    Finance Apps screen
  5. On the Travel Reimbursement screen, click Add.

    Travel Reimbursement screen
  6. On the Trust App screen, click Trust it.
  7. Click Return to site.