Page re-load/refresh after JavaScript alert - dont want it do!

Question

My JavaScript function is working but for some reason after the alert is displayed inside my IF statement the page re-loads/refresh and I do not want it to. Why is this and how can I change my function so that it will not do this?

My function

function valSubmit(){    
    varName = document.form1.txtName.value;
    varSurname = document.form1.txtSurname.value;
    varEmail = document.form1.txtEmail.value;
    varOrg = document.form1.txtOrg.value;

    if (varName == "" || varSurname == "" || varEmail == "" || varOrg == "" ) 
    {

     alert("Please fill in all mandatory fields");  

    }
    else
    { 
        document.body.style.cursor = 'wait';
        document.form1.btnSubmit.style.cursor = 'wait';
        document.form1.action = "http://now.eloqua.com/e/f2.aspx"
        document.form1.submit();
        return true;    
    }

 }

p.s I am using ASP.NET 3.5

Answer 1

Here is your complete function with the return false statement added.

Additionally, when you call valSubmit, it should look like this:

... onsubmit="return valSubmit();"...

Note, you need to specify return here also.

Here is the function:

function valSubmit(){

varName = document.form1.txtName.value;
varSurname = document.form1.txtSurname.value;
varEmail = document.form1.txtEmail.value;
varOrg = document.form1.txtOrg.value;

 if (varName == "" || varSurname == "" || varEmail == "" || varOrg == "" ) 
 {

     alert("Please fill in all mandatory fields");
     return false;

 }
 else
 { 
    document.body.style.cursor = 'wait';
    document.form1.btnSubmit.style.cursor = 'wait';
    document.form1.action = "http://now.eloqua.com/e/f2.aspx"
    document.form1.submit();
    return true;    
 }

}

Answer 2

you have to add return false; to stop the default action from taking place from the form submit