Why does my form still submit when my javascript function returns false?

Question

Here is my Javascript formvalidator function:

function companyName() {
    var companyName = document.forms["SRinfo"]["companyName"].value;
    if (companyName == ""){
    return false;
    } else {
    return true;
    }
}

function companyAdd() {
    var companyAdd1 = document.forms["SRinfo"]["companyAdd1"].value;
    if (companyAdd1 == ""){
    return false;
    } else {
    return true;
    }
}

function companyCity() {
    var companyCity = document.forms["SRinfo"]["companyCity"].value;
    if (companyCity == ""){
    return false;
    } else {
    return true;
    }
}

function companyZip() {
    var companyZip = document.forms["SRinfo"]["companyZip"].value;
    if (companyZip == ""){
    return false;
    } else {
    return true;
    }
}

function enteredByName() {
    var enteredByName = document.forms["SRinfo"]["enteredByName"].value;
    if (enteredByName == ""){
    return false;
    } else {
    return true;
    }
}

function dayPhArea() {
    var dayPhArea = document.forms["SRinfo"]["dayPhArea"].value;
    if (dayPhArea == ""){
    return false;
    }
}

function dayPhPre() {
    var dayPhPre = document.forms["SRinfo"]["dayPhPre"].value;
    if (dayPhPre == ""){
    return false;
    } else {
    return true;
    }
}

function dayPhSub() {
    var dayPhSub = document.forms["SRinfo"]["dayPhSub"].value;
    if (companyAdd1 == ""){
    return false;
    } else {
    return true;
    }
}

function validateForm() {
        if (companyName() && companyAdd() && companyCity() && companyZip() && enteredByName() && dayPhArea() && dayPhPre() && dayPhSub()) {
            return true;        

        } else {
            window.alert("Please make sure that all required fields are completed.");
            document.getElementByID("companyName").className = "reqInvalid";
            companyName.focus();
            return false;
        }
    }

Here are all of my includes, just in case one conflicts with another (I am using jquery for their toggle()):

<script type="text/javascript" src="formvalidator.js"></script>
<script type="text/javascript" src="autoTab.js"></script>
<?php 
require_once('mobile_device_detect.php');
include_once('../db/serviceDBconnector.php');
$mobile = mobile_device_detect();

if ($mobile) {
        header("Location: ../mobile/service/index.php");
    if ($_GET['promo']) {
        header("Location: ../mobile/service/index.php?promo=".$_GET['promo']);
    }
}

?>
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>

Here is my form tag with the function returned onSubmit:

<form method="POST" action="index.php" name="SRinfo" onsubmit="return validateForm();">

The validation works perfectly, I tested all fields and I keep getting the appropriate alert, however after the alert the form is submitted into mysql and sent as an email. Here is the code where I submit my POST data.

if($_SERVER['REQUEST_METHOD']=='POST') {
// Here I submit to Mysql database and email form submission using php mail()

You should validate the form server-side too

mrtsherman
– mrtsherman

2012-03-20 16:49:57 +00:00
Commented Mar 20, 2012 at 16:49 — mrtsherman
– mrtsherman, Commented Mar 20, 2012 at 16:49

James Montagne · Accepted Answer · 2012-03-20 16:49:11Z

5

It would seem to me that this line is likely blowing up:

companyName.focus();

The only definition I see for companyName is the function. You can't call focus on a function.

This blows up so the return false is never reached.

answered Mar 20, 2012 at 16:49

James Montagne

78.9k14 gold badges115 silver badges132 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

jnthnjns Over a year ago

Good call, that line was left over from my previous version of the formValidator, which the first version did work but my boss didn't like multiple alert's. When I removed that line it didn't work but then I removed both document.getElementByID("companyName").className = "reqInvalid"; & companyName.focus(); and it worked perfectly. Thanks!

Jezza · Accepted Answer · 2012-03-20 16:58:49Z

0

I would comment out all the code in the validation section and simply return false. If this stops the form from posting then there is an error in the actual code performing the validation. Add each part one at a time until the error is found.

My guess is the same as James suggests that you are calling focus on the function 'companyName'. The line above this seems to be trying to get the element from the document with the same name but you are not assigning this to a variable so that you can call focus on it.

answered Mar 20, 2012 at 16:58

Jezza

312 bronze badges

Collectives™ on Stack Overflow

Why does my form still submit when my javascript function returns false?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related