wesmanbigmig13
asked on
Make form validation and anti-spam work together
Hi Experts
I have got a simple HTML form that I am submitting to a PHP form-to-mail script. I have got a form validation script that checks to see if certain fields have been completed on the form and I have also loaded a script called ValidBotBoot() which loads two random numbers (x + y) and asks the user to enter the correct answer. This is done to help prevent spammers from auto-submitting the form.
Both scripts work fine when tested by themselves (ie individually), but when I try to execute both together when the form is submitted things don't go according to plan - if the form validation script is passed successfully then the ValidBotBoot() function seems to be ignored and the form is still passed to the form-to-mail page, even if the user has entered no value or an incorrect value for the answer to the simple sum that the ValidBotBoot() function generates.
How can I fix this so that all form validation fields have to be completed correctly AND the correct answer is entered in the "What is x + y" field?
Here is the form validation script:
<SCRIPT LANGUAGE="JavaScript">
<!--
function testData() {
if (document.form.fullname.va lue == "") {
alert ("\nPlease provide your Full Name\t\n")
return false;
}
if (document.form.email.value == "") {
alert ("\nPlease provide a valid Email Address\t\n")
return false;
}
if (document.form.phone.value == "") {
alert ("\nPlease provide a contact Phone Number\t\n")
return false;
}
if (document.form.bookingdate .value == "dd/mm/yyyy") {
alert ("\nPlease provide a Booking Date\t\n")
return false;
}
if (document.form.pickup.valu e == "") {
alert ("\nPlease provide a Pickup Up location\t\n")
return false;
}
if (document.form.dropoff.val ue == "") {
alert ("\nPlease provide a Drop Off location\t\n")
return false;
}
if (document.form.occasion.va lue == "") {
alert ("\nPlease let us know which Occasion your booking is for\t\n")
return false;
}
if (!document.form.agree.chec ked) {
alert ("\nPlease tick the declaration box to confirm that you agree with it\t\n")
return false;
}
}
// -->
</SCRIPT>
Here is the ValidBotBoot() script:
<script type="text/javascript">
var a = Math.ceil(Math.random() * 10);
var b = Math.ceil(Math.random() * 10);
var c = a + b
function DrawBotBoot()
{
document.write("What is "+ a + " + " + b +"? ");
document.write("<input id='BotBootInput' type='text' maxlength='2' size='2'/>");
}
function ValidBotBoot(){
var d = document.getElementById('B otBootInpu t').value;
if (d == c) return true;
alert("Please type the correct answer to submit your enquiry");
return false;
}
</script>
Here is the form header code showing how I have called both functions to be executed when the form is submitted:
<form method="post" action="send_form_email.ph p" name="form" id="form" onSubmit="return ValidBotBoot(), testData()">
Many thanks
I have got a simple HTML form that I am submitting to a PHP form-to-mail script. I have got a form validation script that checks to see if certain fields have been completed on the form and I have also loaded a script called ValidBotBoot() which loads two random numbers (x + y) and asks the user to enter the correct answer. This is done to help prevent spammers from auto-submitting the form.
Both scripts work fine when tested by themselves (ie individually), but when I try to execute both together when the form is submitted things don't go according to plan - if the form validation script is passed successfully then the ValidBotBoot() function seems to be ignored and the form is still passed to the form-to-mail page, even if the user has entered no value or an incorrect value for the answer to the simple sum that the ValidBotBoot() function generates.
How can I fix this so that all form validation fields have to be completed correctly AND the correct answer is entered in the "What is x + y" field?
Here is the form validation script:
<SCRIPT LANGUAGE="JavaScript">
<!--
function testData() {
if (document.form.fullname.va
alert ("\nPlease provide your Full Name\t\n")
return false;
}
if (document.form.email.value
alert ("\nPlease provide a valid Email Address\t\n")
return false;
}
if (document.form.phone.value
alert ("\nPlease provide a contact Phone Number\t\n")
return false;
}
if (document.form.bookingdate
alert ("\nPlease provide a Booking Date\t\n")
return false;
}
if (document.form.pickup.valu
alert ("\nPlease provide a Pickup Up location\t\n")
return false;
}
if (document.form.dropoff.val
alert ("\nPlease provide a Drop Off location\t\n")
return false;
}
if (document.form.occasion.va
alert ("\nPlease let us know which Occasion your booking is for\t\n")
return false;
}
if (!document.form.agree.chec
alert ("\nPlease tick the declaration box to confirm that you agree with it\t\n")
return false;
}
}
// -->
</SCRIPT>
Here is the ValidBotBoot() script:
<script type="text/javascript">
var a = Math.ceil(Math.random() * 10);
var b = Math.ceil(Math.random() * 10);
var c = a + b
function DrawBotBoot()
{
document.write("What is "+ a + " + " + b +"? ");
document.write("<input id='BotBootInput' type='text' maxlength='2' size='2'/>");
}
function ValidBotBoot(){
var d = document.getElementById('B
if (d == c) return true;
alert("Please type the correct answer to submit your enquiry");
return false;
}
</script>
Here is the form header code showing how I have called both functions to be executed when the form is submitted:
<form method="post" action="send_form_email.ph
Many thanks
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.