Let’s start with HTML Form attributes
In this part of the code, you have an HTML form with HTML5 validate tool added. This is the first step that allows a website to check if all fields are fielded and if the email includes the “@” sign. In the password field also when you typing the password the spot appears, which protects visitors’ privacy in some way. You can even improve this protection using an HTML attribute named pattern. But in this case, we skip this step. Last word about HTML form presented above: table form I used just to build a simple skeleton for this HTML form looks. There is no reason that you need to do this.
Java Script as a part of HTML form
Then I set three variables, to able me to check stored data in a more advanced way. I mean thanks’ setting this variable I can check if there are enough characters in login or in password, and even if the password or email address includes necessary characters. That’s all I wrapped in if-else construction. What’s more, this code will display users’ different alert boxes depend on which input fields were fielded by wrong data. This helps them correct this field quickly. If the validation procedure succeeds data will be sent to the server.
Is this validation enough?
This type of validation is called client-side validation. It’s because all code action takes place in web browsers. When we talk about regular users this is enough to be sure, that data send to the server has the required format. But as I mention before hackers don’t sleep and they searching for a website where data sending to the server isn’t validated on the server site. What does server site validation mean?
First of all, you can use for example PHP function to remove unexpected characters from sending data and then, just like I wrote in this post validate again data this time using for example PHP. But this is another huge topic, and perhaps I wrote about this latter.