在Chrome中，JavaScript提交功能只能运行一次

Question

I have created a signup form. If all three fields have correct values then I submit the form. Otherwise error displays and the form is not submitted.

function checkUserValidation() {
    if ((validateEmail() == true) && (validatePassword() == true) && (validateRepeatPassword() == true)) {
        document.getElementById('signup-form').submit(); // This works only first time in chrome..
        return true;
    } else {
        return false;
    }
}

<form id="signup-form">
    <div class="container">
        <label> <b>Email</b> </label>
        <input id="signup-email" class="signup_field" type="text" name="signup-email" required onfocusout="validateEmail()" />
        <label id="Invalid-Signup-Email" style="visibility:hidden;"></label>
        <label> <b>Password</b> </label>
        <input id="signup-pass" class="signup_field" type="password"  name="signup-pass" required onfocusout="validatePassword()" />
        <label id="Invalid-Signup-Pass" style="visibility:hidden;"></label>
        <label> <b>Confirm your Password</b> </label>
        <input id="signup-rep-pass" class="signup_field" type="text"  name="signup-rep-pass" required  onfocusout="validateRepeatPassword()" />
        <label id="Invalid-Signup-Rep-Pass" style="visibility:hidden;"></label>
    </div>
    <div class="clearfix">
        //following code does not work properly
        <input class="signupbtn" type="button" name="signup" value="Sign Up" onclick="return checkUserValidation(); submit()" /> 
    </div>
</form>

Problem is the submit function works only once in Chrome (working fine in IE). Next time the form does not submit even if I enter all the correct values.

Searched and tried solutions mentioned on Stack Overflow but nothing worked.

Answer 1

Look at your submit input, you are returning a value return checkUserValidation(); and after you're submitting submit();

<input class="signupbtn" type="button" name="signup" value="Sign Up" onclick="return checkUserValidation(); submit()" /> 

We can't put anything after return statement because the execution die or finish at that point.

I guess you're trying to do something like:

if(checkUserValidation() == true){ submit(); }

I recommend you to make a JS file (don't use inline JS) and then try with the if statement above

Answer 2

First of all "validateEmail", "validatePassword" and "validateRepeatPassword" are not defined anywhere.

Secondly, when you are already submitting the form after checking all the field level validation, then what's the point of having the return true statement;