Calling multiple Javascript functions onSubmit

Question

I'm trying to call multiple JavaScript functions. It submits even though my functions return false. I receive the alert messages but it submits anyway.

This is my form.

<form name="myform" id="myform" action="receipt.html" method="post" onSubmit="return allValidation();">

• SLaks: You aren't using the return values.
• dafyddgj: @SLaks I've edited the functions now. Something like that?

Answer 1

You aren't returning anything in allValidation, so that it will continue to next method execution. Try this,

function allValidation() {
 return validateForm() && selectCountry() && validateEmail();
}

• Darshan Patel: add default return true value(as last line) in all validateForm(), selectCountry(), validateEmail() methods.
• dafyddgj: Now it submits if validateForm is true and bypasses the other two functions
• Darshan Patel: return true should be without bracket. I have modified your question with my suggestion. Hope this will resolve your issue. Keep trying..
• dafyddgj: Excellent! Thanks you so much.

Answer 2

You can use multiple functions and then and their results to get final validation. and also add return true statements in all functions where validation is successful

function allValidation()
 {
 return (validateForm() && selectCountry() && validateEmail());
 }

Answer 3

It's because your function always return true no matter what values return the validateForm() selectCountry() and validateEmail() functions.

Change your allValidation() function like this:

function allValidation()
{
 return validateForm() && selectCountry() && validateEmail();
}

• dafyddgj: This bypassed the selectCountry() and validateEmail() functions and submits if validateForm() works.
• Ciprian Stoica: @dafyddgj , I don't think so.. I tested the code on Chrome 47, Firefox 42 and IE 8 and it worked on all of them. Javascript evaluates the functions one by one, starting from the left and stops on the first function that returns false (if any). In such case, allValidation() returns false and indeed, the rest of the functions are bypassed. If all functions return true, then the allValidation() returns true. So, using return validateForm() && selectCountry() && validateEmail(); or return (validateForm() && selectCountry() && validateEmail()); has exactly the same effect.

Answer 4

function allValidation(){
 return validateForm() && selectCountry() && validateEmail();
}

• Jonathan Lam: Please avoid code-only answers. Please add an explanation.