Why is returning false with onSubmit reloading?

Question

I know this probably staring me in the face but:

I have a basic for with a for header of:

<form onSubmit="return validateClinicalReports();" name="clinicalreport" method="post" action="process.php" enctype="multipart/form-data">

the js looks at each input using: document.getElementById("name"). If it sees that the input is blank it colors the input yellow, selects it, and give is focus. Pretty simple, I use it on another form that has different inputs:

if(name == "")
    {
        document.getElementById("name").style.backgroundColor = "yellow";
        document.getElementById("name").select();
        document.getElementById("name").focus();
        return false;
    }

I literally copied that from another function (just changed the variable and id to name). When I submit I can see it take the blank input yellow, then it reloads the whole form. My other forms work fine with.

Any ideas?

Answer 1

Turns out you shouldn't get in a hurry and use a preset keyword as you input id name :::headdeask:::

Answer 2

The onSubmit handler calls validateClinicalReports() without any parameters. You didn't include the complete function, but what is the "name" variable and where does it come from?

My guess is that the "if (name == "")" code is not getting executed at all. You can verify that it is getting called by adding an alert() call as the first statement inside the if body. You can probably just remove the if() test completely and always execute the code.

Also, if you are going to use getElementById(), you should add "id=name" to the form tag.