By Sergey Skudaev
I used different methods for form validation. This one I like the most. It takes all fields on the form and walk through.
To see source code, click on the webpage with right mouse button and select view source code.
The toDefault(x) function returns style properties back to default values.
Below in the text area is markup for the form.
It is said that structure, presentation and behavior should be pure. However, the-separation-of-structure-presentation-and-behavior-is-dead
Anyway, below I presented a different approach to changing the border and backgorund color while performing the form validation.
In the new validation function, I adding to the element that failed validation, a CSS class that changes the border and the background color. When visitor clicks inside the field, on the focus event, the class is removed and the border and the background color change back to default.