Form Validation in Power Apps — Part 1

In this blog, we are going to see how we can do the implementation of form validation in Power Apps.

Let get started, I have designed the Sign-Up page which has the following fields:

  1. Email
  2. Password and Confirm Password
  3. Phone Number

Following is Screenshot of my Sign-Up Page build in PowerApps:

Following is App Controls Structure which I have followed to Create Sign Up Form:

I have used “ErrorText” which is HTML Label Control for Logging all the Validation Errors.

Now, we will set the Properties on ErrorText control to display the error on the Form for Each Input

Following is an explanation of each validation which I have used in this Power Apps:

Email Validation

  1. Not(IsBlank(‘ControlName’)) — It will validate if Field is blank or not.
  2. IsMatch(‘ControlName’.Text , Match.Email) — It will validate the email format and return false if user enter invalid Email Address
  3. Code:
If(Not(IsBlank('Email Address')),
  If(
    IsMatch(
    'Email Address'.Text,
     Match.Email
    ),
    "",
    "Please Enter Valid Email <br>"
  ),
  "Please Enter Email <br>"
)

Password and Confirm Password Validation

  1. Not(IsBlank(‘ControlName’)) — It will validate if Field is blank or not.
  2. ‘Confirm Password’.Text = Password.Text — It will validate if the password and confirm password are the same or not. It will return false if both password will not match.
  3. Code:
If(
  Not(IsBlank('Confirm Password')) && Not(IsBlank('Password')),
  If(
    'Confirm Password'.Text = Password.Text,
    "",
    "Please enter Same Password <br>"
  ),
  "Please Enter Passwords <br>"
)

Phone Number Validation

  1. Not(IsBlank(‘ControlName’)) — It will validate if Field is blank or not.
  2. IsMatch(‘Control’.Text, “Your country Phone Validation ReGex”) — It will validate if the entered phone number is valid or not using ReGex.
  3. I have used phone number validation ReGex for India — “^[6–9]\d{9}$”
  4. Following is an explanation of my ReGex:
^     #Match the beginning of the string
[6-9] #Match a 6, 7, 8 or 9
\d    #Match a digit (0-9 and anything else that is a "digit" in the regex engine)
{9}  #Repeat the previous "\d" 9 times (9 digits)
$    #Match the end of the string

5. Code:

If(
  Not(IsBlank('Phone Number')),
  If(
    IsMatch('Phone Number'.Text, "^[6-9]\d{9}$"),
    "",
    "Please enter Valid Phone No <br>"
  ),
 "Please Enter Phone No. <br>"
)

Following is full code for Validation you need to paste in Formula bar of HtmlText Property:

If(Not(IsBlank('Email Address')),
  If(
    IsMatch(
    'Email Address'.Text,
     Match.Email
    ),
    "",
    "Please Enter Valid Email <br>"
  ),
  "Please Enter Email <br>"
)&
If(
  Not(IsBlank('Confirm Password')) && Not(IsBlank('Password')),
  If(
    'Confirm Password'.Text = Password.Text,
    "",
    "Please enter Same Password <br>"
  ),
  "Please Enter Passwords <br>"
)&
If(
  Not(IsBlank('Phone Number')),
  If(
    IsMatch('Phone Number'.Text, "^[6-9]\d{9}$"),
    "",
    "Please enter Valid Phone No <br>"
  ),
 "Please Enter Phone No. <br>"
)

Result:

Blank Field Validation for each Fields — Email, Password, Confirm Password and Phone Number

Email Format Validation

Now, you can see after entering valid email error has gone

Password and Confirm Password Match Validation

Phone Number Format Validation Check

After adding valid phone number error is gone

Hope this helps, stay tuned for more blogs.


Share Story :

SEARCH BLOGS :

FOLLOW CLOUDFRONTS BLOG :


Secured By miniOrange