In the last lecture we detected this error when we change the value of our dropdown, it is related
to our validation check in the contact data container. There in check validity,
we check if rules required,
the problem is rules,
what does this get,
what does rule of this argument refer to?
Let's have a look at where we call check validity,
we call it in the inputChangedHandler and we pass the update form element value
and for rules, updatedFormElement validation.
Now the thing is this validation object doesn't exist for the dropdown for delivery method,
so if we then try to access required on something which doesn't exist, we get an error. Two ways of fixing
that,
the first way is simply add an empty validation object to the dropdown control.
Now accessing validation required will not fail but simply return undefined,
I like this way a lot because now all our controls are set up equally,
they all have a validation property and a valid property,
and if they don't need validation, then it should just be empty.
This is why I like this approach.
Now the alternative would have been to also add a check in check validity and see if rules,
if this is true-ish which it only is if it is defined and if it is not true-ish, so by adding an exclamation
mark, to simply return true then.
So always return true for the check validity result if no validation rules are defined.
We can of course also implement both for double security but again, I like the approach up here by adding
this empty validation object the most because it makes all the controls configured equally.
Now with this added, if I save this, now we can change the dropdown value again without getting errors
as you can see.