PHP Validation and Javascript Validation won't work together

Question

When I combine my php form validation code with my javascript validation code, the javascript code fails to work when I hit the submit button. It will only validate the first form field and not the 3 others and then php will validate all fields. I don't want the php form validation to do anything until javascript has completed the form validation.

When I use only php or only javascript to validate, then the code works correctly. What am I missing here? Is it something to do with the beginning of the form?

"form name="contactform" id="contactform" method="post" 
action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" 
onsubmit="return validateentry();">"

Am I supposed to do the php form validation while "action" goes to a different web page?

The javascript code:

function validateemail()
{
var emailentry=document.forms.contactform.email.value;
at=emailentry.indexOf("@");
period=emailentry.lastIndexOf(".");
if(at < 1 || ( period - at < 2 )) 
{
   alert("Please enter correct email in the format of 'yourmail@yourwebsite.com'")
   document.forms.contactform.email.focus();
   return false;
}
return(true);
}


function validatephonenumber()
{
var re = /(?:\d{3}|\(\d{3}\))([-\/\.])\d{3}\1\d{4}/;  
    var numbers = document.forms.contactform.phone.value; 
    var verified = re.exec(numbers);  
    if (!verified)  
    {
alert("Please enter a phone number in the format of 999-999-9999");
return false;
}  
    return(true); 
}

function validateentry()
{
if(document.forms.contactform.name.value=="")
{
 alert("Please provide your name.");
 document.forms.contactform.name.focus();
 return false;
}

if(document.forms.contactform.company.value=="")
{
 alert("Please provide your company name. If you don't have one, simply state 
 that you don't.");
 document.forms.contactform.company.focus();
 return false;
}

 if(document.forms.contactform.email.value == "")
 {
 alert("Please provide an Email address.");
 document.forms.contactform.email.focus();
 return false;
 }else{
 var validformat=validateemail();
 if(validformat==false)
 {
 return false;
 }}

if(document.forms.contactform.phone.value=="")
{
 alert("Please provide a phone number in the format 999-999-9999.");
 document.forms.contactform.phone.focus();
 return false;
}
else if(document.forms.contactform.phone.value.length < 12)
{
    alert("Please provide the phone number in the format of 999-999-9999.");
    document.forms.contactform.phone.focus();
        return false;
}
    else
    {
    var validnumber=validatephonenumber();
    if(validnumber==false)
    {
    return false;
    }}

if(document.forms.contactform.msg.value=="")
{
 alert("Please provide a message.");
 document.forms.contactform.msg.focus();
 return false; 
}
 return(true);
}

Answer 1

It's unclear without more code but based on your comment I am going to guess that you have incorrectly written your php and it's breaking your javascript/html code. Perhaps one of your quotes? Look at the source code of the page and run it through one of the online validation services such as http://validator.w3.org and http://www.jslint.com

Answer 2

Try this:

PHP HTML:

<?php
echo "<form name='contactform' id='contactform' method='post' 
action='' onsubmit='return validateentry(this);'>"
...

Validation JavaScript:

function validateemail(e)
{
    var emailentry = e.value
        , at = emailentry.indexOf("@")
        , period = emailentry.lastIndexOf(".");

    if(at < 1 || ( period - at < 2 )) 
    {
       alert("Please enter correct email in the format of 'yourmail@yourwebsite.com'")
       e.focus();
       return false;
    }
    return true;
}


function validatephonenumber(e)
{
    var re = /(?:\d{3}|\(\d{3}\))([-\/\.])\d{3}\1\d{4}/
        , numbers = e.value;

    if (!re.exec(numbers))
    {
        alert("Please enter a phone number in the format of 999-999-9999");
        e.focus();
        return false;
    }
    return true;
}

function validateentry(f)
{
    if(f.name.value == "")
    {
        alert("Please provide your name.");
        f.name.focus();
        return false;
    }

    if(f.company.value == "")
    {
        alert("Please provide your company name. If you don't have one, simply state 
        that you don't.");
        f.company.focus();
        return false;
    }

    if(f.email.value == "")
    {
        alert("Please provide an Email address.");
        f.email.focus();
        return false;
    }
    else
    {
        var validformat = validateemail(f.email);
        if(validformat == false)
        {
            return false;
        }
    }

    if(f.phone.value == "" || f.phone.value.length < 12 || (validnumber = validatephonenumber(f.phone)) == false)
    {
        alert("Please provide the phone number in the format of 999-999-9999.");
        f.phone.focus();
        return false;
    }

    if(f.msg.value == "")
    {
        alert("Please provide a message.");
        f.msg.focus();
        return false; 
    }
    return true;
}