Input Validation with Multiple Conditions

Hey guys, just sharing a little workaround I’ve discovered in case it’s helpful to someone else.

I have a set of conditions (5 of them) that must be met in order for the button to be clickable.

In plain English:

  1. The user must be trying to create a custom color gradient (State: Custom Color = Yes)
  2. The primary color and the secondary color input must both start with a # sign and contain exactly 7 characters (A total of 4 “or” conditions)

So,
IF (Custom Color=Yes)
AND (Primary color doesn’t start with #
OR Secondary color doesn’t start with #
OR Primary color characters isn’t 7
OR Secondary color characters isn’t 7)
THEN This button isn’t clickable.

I found this unworkable in a single expression without parenthesis.

So, what I did what I created a tiny 1 pixel group called “Group Validator” with a data type of yes/no and a default data of “yes”

Then I made a conditional expression on it holding all of the or statements and if ANY of them triggers it changes the groups data to “no”

Then, on the button I put a simple conditional “If Custom Color is “Yes” AND Group Validator is “NO” THEN this button is not clickable”

Hope that helps someone.

image

image

1 Like