Instructor: 00:01 Generally, I think it's nice to validate on blur as well, so when the user leaves a field, consider this example. Here, I type an email. Then I type hello, which is not a valid password, but now I didn't get any feedback that it's not a valid password.
00:18 I'm going to type hello again. Then, when I submit, only then do I get feedback that that password is not good enough. Then I have to go back and change it and change the confirmed password as well.
00:32 We can add validation on blur. Let's just import the onBlur function. Then we'll need the respective messages.
00:50 Then let's go to the view where we raise these messages.
01:08 Finally, we need to handle these new messages in the applet function. Let me duplicate this. This will be blur email, there's no payload. All we want to do is perform validation. It's not onChange, but let's assume we have a new type of event, onBlur. Let me go to my validation module and define this onBlur event. Then I need to handle this when I validate.
01:41 What we want to do is exactly the same on submit. In a sense, when the user leaves the field, he's committed to that value, so we can actually force the validation. Now, back in my Main.elm file, let me add cases for the remaining message types.
02:30 Let's see what happens now. Let me type an invalid email and an invalid password. Now it says, "Your password isn't strong enough." Before I spend the time to retype the password, let me fix it first. Then I can say hello1 again. Before I go to submit, let me fix the email as well. Now I have a successful submission.
03:03 Notice that if I look at my applet function now, it's actually pretty long. That's because we are now handling two message types for each input. Because the type of validation we want to do on input and on blur is different, there's no easy way to unify these messages.