# Form validation!

**URL:** <https://forum.codewithmosh.com/t/form-validation/4923>\
**Category:** React\
**Created:** [May 16, 2021, 8:33am UTC](https://forum.codewithmosh.com/t/form-validation/4923 "2021-05-16T08:33:31Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![sh2021](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@sh2021](https://forum.codewithmosh.com/u/sh2021)\
**Post date:** [May 16, 2021, 8:33am UTC](https://forum.codewithmosh.com/t/form-validation/4923/1 "2021-05-16T08:33:31Z")

</div>

i am wondering, why Mosh in video 14 (validating a Form Using Joi) defined “errors” object again inside validate() in loginForm.jsx, since there were already “errors” object in the state ?? can anybody clarify that to me? appreciate it

---

<div class="post-metadata">

**Author:** ![rob](https://avatars.discourse-cdn.com/v4/letter/r/838e76/32.png) [@rob](https://forum.codewithmosh.com/u/rob)\
**Post date:** [May 18, 2021, 12:35am UTC](https://forum.codewithmosh.com/t/form-validation/4923/2 "2021-05-18T00:35:54Z")

</div>

@sh2021 Can you explain more about what in confusing about this? What would you have done instead? I’m not sure if you’re asking ‘why did Mosh just initialize errors to {} instead of reading the errors first like in handleChange’ or something different.

---

<div class="post-metadata">

**Author:** ![sh2021](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@sh2021](https://forum.codewithmosh.com/u/sh2021)\
**Post date:** [May 19, 2021, 10:09am UTC](https://forum.codewithmosh.com/t/form-validation/4923/3 "2021-05-19T10:09:15Z")

</div>

we had “errors” in state already and could read it instead of defining it locally again in validate()? got the point now?

---

<div class="post-metadata">

**Author:** ![rob](https://avatars.discourse-cdn.com/v4/letter/r/838e76/32.png) [@rob](https://forum.codewithmosh.com/u/rob)\
**Post date:** [May 22, 2021, 2:56am UTC](https://forum.codewithmosh.com/t/form-validation/4923/4 "2021-05-22T02:56:10Z")

</div>

In the handleChange method we want to validate just the property that is being changed without touching any other errors that the user can currently see. To make sure we keep those errors that exist, we read in the current errors from the state:

`const errors = { ...this.state.errors };`

Then we replace the error for the current property and set the state with the errors object.

However, in the validate() method, we are validating the entire form. We’re going to validate each field no matter what, so we don’t care if errors already exist in the state. If our application is working properly, initializing errors as {} would be the exact same result as initializing it with the state like we did in the handleChange method.
