CODEWITHSUNDEEP
javascripthtmlvalidation
Stefano Tokyo
Stefano Tokyo

Reputation: 85

Form validation fields

Okay I have the email and password field. Their validation are set. For the password field , if the confirmed password is not good it will tell you same as for the email format.

But when I click register It will validate the form whether or not the fields are correct or incorrect. 

   <div class="form-group">
        <input class="btn btn-success" type="submit" name="submit_reg" value="Register" >
        </div>

Someone know how to fix this ? Here's a part of my code https://jsfiddle.net/tk2nqbo9/1/

Upvotes: 0

Views: 40

Answers (1)

Gerrit0
Gerrit0

Reputation: 9182

Your validation, though it may be displaying errors correctly, is in no way preventing the form from being submitted. If you want to prevent submissions while there are errors you need to add an event listener to the form submission.

Your listener could look something like this:

document.querySelector('form').addEventListener('submit', function(event) {
    if (!passwordCheck()) {
        reportError("Password error");
        event.preventDefault(); //Stops the submission of the form
    }

    if (!emailCheck()) {
        reportError("Email error");
        event.preventDefault();
    }

    //Got here? All good, don't do anything. 
});

You may also be interested in the pattern attribute. At the very least, it can replace your email_validate function.

Upvotes: 1

Related Questions