All language subtitles for 011 Form Validation_en

The layout of our application is pretty well coming together at this point, however, if I enter in

some clearly invalid email and then click on the submit button, I'm presenting no feedback to my user

to let them know that this email is not valid.

So in this section, we're going to start turning to the actual submission of this form and figuring

out how we can validate the values inside these inputs and then eventually access the values that the

user entered.

So to get started, we're going to take a look at a quick diagram that's going to layout this process.

OK, so here's the steps, everything is going to start up here and step number one, the user pressing

that submit button.

It's only when the user presses the button that we're going to start the validation process.

When the user presses the button, the unpressed callback that we added to our raised button, which

it is going to be invoked.

So if you recall, down at the bottom, we have our submit button right here.

Here's the race button widget.

And on the reset button, we added the on pressed callback.

So any time a user presses the button, this function right here is going to be invoked.

So this function is going to be the perfect location for you and I to add some location to attempt to

validate the form and then eventually access the values inside of it.

So once we had that call back in, or I guess we already did, once that call back is invoked, we're

going to attempt to access the form widget and we're going to tell that form widget, hey, you need

to validate all of your text form field children.

So quick reminder, here's our widget hierarchy inside of our hierarchy of the login screen.

We created that form widget and we just very quickly brushed over it.

So inside of our build method right here, here's the build method here.

Is that where we created a form widget instance?

So we need to get direct access to that form and we need to tell it, hey, you need to find all of

your text form field children and you need to tell them that they need to validate themselves and make

sure that they have appropriate inputs.

Now, behind the scenes, any time that we place a form widgets with some text form fields as a child

to it, the form gets this kind of behind the scenes direct connection to those child text form field

widgets.

So this form right here knows about the existence of this text form field and it knows about the existence

of this text form field.

That's a behind the scenes connection that it's made for us automatically.

And it doesn't matter that there's the column which in between the form, just knows that these text

form fields exist as children.

So all we have to do is get access to the form which in itself and tell it to go find its children and

attempt to validate them.

Then if all those different fields are valid, we're going to then attempt to actually extract the values

that a user entered into them.

And then once we had those values, well, that's the last step here and we'll figure out what we'll

do when we get there.

We definitely have a lot of stuff to do before that.

So in terms of difficulty or the actual implementation of all these steps, I think you'll agree with

me that step number two, one and two right here are pretty straightforward, like we really know how

to add that call back in.

We already did it right here.

So it's really step three where things get interesting.

On step number three, we need to somehow get a reference to the form widget.

And we need to somehow, like, run a method on it that tells it to try to find its children and validate

them, so that's going to be the hard part here.

Let's take a quick pause right now.

We'll come back to the next section and talk about how we're going to achieve step number three.