Question

I have this form:

<form id="basicTerms" method="post" onsubmit="return validateForm()">

and the function in the onsubmit is below:

function validateForm()
{
    return false;
}

I’ve done this to test the form, and when I click Enter or click on a button on the form that performs triggers the form submit action, the form submits and moves to the next page.

I also have these buttons in the form:

<tr>
    <td align="left"><button style="background-color:#FF80FF" onclick="javascript:document.getElementById('basicTerms').action='helpFile1.php'; document.getElementById('basicTerms').submit()" tabindex="6">Go Back</button></td>
    <td align="center"><button style="background-color:#FFC080" onclick="javascript:document.getElementById('basicTerms').action='helpFile2.php'; document.getElementById('basicTerms').submit()" tabindex="4">Lets Go To Step 2</button></td5>
    <td align="right"><button style="background-color:#00FF00" onclick="printThis()" tabindex="5">Print</button></td>
</tr>

I want to know why the forms submits even when I return a false in onsubmit.

I’ve tested the form on Google Chrome and FireFox, both gave the same result. Also, I’m testing on localhost WAMP: Apache2.2.11, PHP5.3.0.

Answer 1

Try adding type="button" to your button tags. Otherwise I believe they default to submit buttons.

(added as an answer since it worked as a solution)