PHP & HTML Form with javascript onsubmit not executed
Question by Baba
I have a HTML form asking for user input. A javascript function is meant to validate the form and should be triggered (using onsubmit) BEFORE executing the PHP code. (The js file is referenced in the header <script type="text/javascript" src="js/javascript.js"></script>
)
HOWEVER the javascript is never executed and instead the PHP code executes and (correctly) includes the new file.
How can i make the javascript execute as required?
HTML file:
<form name="details" action="" method="post"
onSubmit="return ValidateForm(details);">
...
<input type="submit" name="post-this-form" value="Next"/>
</form>
PHP file:
if (isset($_POST['post-this-form']) and
$_POST['post-this-form'] == 'Next')
{
...
some php
...
include 'shipping-details.html.php';
exit();
}
EDIT
here is the javascript as requested. It has been tested and worked without any PHP involved. By passing details
(the name of the form) i’m making all the form fields accessible.
function ValidateForm(details)
{
var firstName=document.forms.details.firstName.value;
var lastName=document.forms.details.lastName.value;
var streetAddress=document.forms.details.streetAddress.value;
var town=document.forms.details.town.value;
var city=document.forms.details.city.value;
var zip=document.forms.details.zip.value;
var country=document.forms.details.country.value;
var creditCard=document.forms.details.creditcard.value;
...
//Checks firstName
if ((firstName=="")||(!firstName.match(alphabetExpression)))
{
alert ("Invalid first name, please re-enter");
return false;
}
...
//Checks creditCard
if ((creditCard=="")||(!creditCard.match(numericExpression))||(creditCardLength!=16))
{
alert ("Invalid credit card entry, please re-enter");
return false;
}
}// end function
EDIT 2
i added alert ("Hi");
to the start of the javascript and the alert never shows up which leads me to think that the function isn’t executed at all.
EDIT 3
My initial suspicion that this problem could be due to PHP was wrong. As Jason mentioned in his comments the problem was in the javascript itself. It is a bit strange thought because the same javascript code worked “on its own” without PHP and on my local machine. So many factors to consider…thanks All for taking the time to have a look at my problem!
Answer by Jason Fuller
Comment converted to answer
“I bet there is a javascript error. Open error console. ctrl+shift+j in firefox.”
Glad that helped.
Answer by Starx
Here are few things you must know the about the functions you are trying to build
function ValidateForm() {
this; // this contains the form name no need for any variable declaration
return true; // or false This is very important to continue the execution
// false stops the submittion
}
When you fix both of these issues, it should work as you want.