Validate Form Inputs
Add Custom Server-side Validations
This lesson is part of the Developer Online Class for OutSystems 9 course.
LEARN MORE

Transcript
The OutSystems Platform automatically validates if the user filled in the data
and if it is compatible with the data type of the variable that stores it
In this lesson, we will see how we can implement
our own input validations
So, before we save anything to the database
We can validate if the data is correct according to some business logic
we already seen that the platform does the validation for mandatory attributes and for data type
But, for instance, if you want to validate that the stock is greater or equal than zero
Then we can add our own custom validations
So, here in the Save action
what we want to do, is actually to create here some logic that
validates if the quantity in stock that the user filled in
is actually greater or equal than zero. And we will do this again with an If
and here in the condition (let me double click to set the condition)
I want to validate
if the quantity in stock is greater or equal than zero
and if it is, then I want to continue
if it is not, so her on the false
on the false side of this If
I want to set a couple of properties in my input
and this means that (let me select here the variable) I want to set
here in the Widgets, you'll find here the input for the quantity in stock
and we have here a couple of properties
The input Valid and ValidationMessage properties allows us to invalidate an input
and add a message explaining the reason to the user So,
here this Valid property, this is a boolean variable
and if we set it to false,
this means that this input will no longer be valid
and this will have effect also on the form Valid property, that we are checking here
next in the flow. So.
we set this to false and we provide a validation message
which will be shown to the end-user next to the input, as you've seen for the mandatory attributes
so here, for instance, let's say that
"Stock needs to be greater or equal than zero"
And, if our validation is correct. So, if our quantity in stock is greater or equal than zero
then we can continue to test if the form is valid
okay. So let's add here a breakpoint.
And, let's start the debugger.
And, let's publish these changes for us to test in the application.
Okay. Let's edit the 'USB Camera'
That we created in the previous lesson.
And, let's say that the quantity in stock is minus five.
Let's save.
And, we're stopped in the breakpoint
And, you'll notice here that, the quantity in stock is minus five.
So this means that, we're going to set the Valid and the ValidationMessage properties
of that input
take notice that it is now a valid input. It will become...
and it is a valid input because it validates according to the mandatory property and data type
And, we are not going to set this to false based on our logic here
So, let me just step into
And the Valid becomes false
Step into again. We have a validation message.
Now.
We step over and you'll notice that
the form Valid property is no longer true, it is false
It means that we will stay on the page and we will see
the message that we just typed in in the development environment
Hmm. Let's go back to the development environment. And, let's validate that
this Price here also needs to positive. It needs to be greater than zero, actually.
So, again, to do this, we will add here another validation (let me just get some space)
And I want to validate that
the Price... So, here, the Price is bigger than zero.
if it is bigger than zero...
(swap the connectors)
if it is bigger than zero then we will continue to test if the form is valid or not
if it is not, I want to assign here
again, the Valid and ValidationMessage properties of that input
So. Here.
In the widgets we will find the price input
and set the Valid property to false.
And set the ValidationMessage to
"Price must be greater than zero"
And we're done. And connect this to the next element in the logic
And I want to make here only one final change
If we display all errors at once, we will save our users some time and frustration.
So, it's better than presenting a single error at a time
This means that here, I will need to reconnect this flow into this validation
Okay. So let's publish and test this validation.
Okay. So again go back to our 'USB Camera'
And, let's say now that the price is minus one
and the quantity is minus one
and let's remove here the 'USB Camera'
So, all these inputs will make my form invalid
Let's try to save it
and, let's see that we're setting the quantity in stock as invalid...
let's add a breakpoint... continue to here
we're setting the product price as invalid. And, let's continue.
And this will all show on, on our form stating that the 'USB Camera' which is ten dollars and has
five elements in stock now this needs to be fixed for our form to be valid
So now we can save this data. Let me just continue here.
And there we have it. That's it.