This is my booking form: http://www.n-v-m.co.uk/Booking.html

When 'Submit Order' is clicked a PHP script is triggered that emails me details of the order...

What I require is an error message to pop up if either:
a) The customer has selected 'No' for 'Is Vehicle roadworthy with full M.O.T.'
or
b) The customer has not checked the 'I agree with the Terms and Conditions' box.

The error message should pop up in front of the booking form and say either "The vehicle must be roadworthy with full M.O.T." or "You must agree to the Terms and Conditions".

There would then be an 'OK' button on the error message which when clicked would take you back to the booking form.

Can somebody please tell me how to do this?

Also, when a successful booking has been made (ie. the above 2 conditions have been met) I would like the PHP script to be triggered and the browser to redirect to http://www.n-v-m.co.uk/Thankyou.html

Can somebody please also explain how this is done?

I have included the code for my booking form and php script below just in case it helps.

Cheers

Paul

Booking Form:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>National Vehicle Movements - Booking Form</title>
<style type="text/css">
<!--
body {
	background-color: #1d255f;
	margin: 0px;
	padding: 0px;
}
#apDiv1 {
	position:absolute;
	width:487px;
	height:706px;
	z-index:auto;
	left: 50%;
	top: 433px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	textarea-align: center;
	background-position: center;
	margin-left: -244px;
}
-->
</style></head>
 
<body>
<div align="left">
  <div id="apDiv1">
    <form id="form1" name="form1" method="post" action="sendform.php">
<table width="400" border="0" align="center">
  
  <tr>
    <td width="193" align="center">Company:</td>
    <td width="197" align="center"><input type="text" name="company" id="Company" /></td>
  </tr>
  <tr>
    <td align="center">Name:</td>
    <td align="center"><input type="text" name="name" id="Name" /></td>
  </tr>
  <tr>
    <td align="center">Phone Number:</td>
    <td align="center"><input type="text" name="phonenum" id="Phone Number" /></td>
  </tr>
  <tr>
    <td align="center">Email Address:</td>
    <td align="center"><input type="text" name="email" id="Email" /></td>
  </tr>
  <tr>
    <td align="center">Vehicle Make and Model:</td>
    <td align="center"><input type="text" name="vmam" id="Vehicle Make and Model" /></td>
  </tr>
  <tr>
    <td align="center">Vehicle Reg./Ref. No.:</td>
    <td align="center"><input type="text" name="vreg" id="Vehicle Reg." /></td>
  </tr>
  <tr>
    <td align="center">Collection Address including Postcode:</td>
    <td align="center"><textarea name="colladd" rows="4" id="Collection Address"></textarea></td>
  </tr>
  <tr>
    <td align="center">Collection Contact Name:</td>
    <td align="center"><input type="text" name="collconname" id="Collection Contact Name" /></td>
  </tr>
  <tr>
    <td align="center">Collection Contact Number:</td>
    <td align="center"><input type="text" name="collconnum" id="Collection Contact Number" /></td>
  </tr>
  <tr>
    <td align="center">Delivery Address including Postcode:</td>
    <td align="center"><textarea name="deladd" rows="4" id="Delivery Address"></textarea></td>
  </tr>
  <tr>
    <td align="center">Delivery Contact Name:</td>
    <td align="center"><input type="text" name="delconname" id="Delivery Contact Name" /></td>
  </tr>
  <tr>
    <td align="center">Delivery Contact Number:</td>
    <td align="center"><input type="text" name="delconnum" id="Delivery Contact Number" /></td>
  </tr>
  <tr>
    <td align="center">Collection Date/Time:</td>
    <td align="center"><input type="text" name="collectiondt" id="Collection Date/Time" /></td>
  </tr>
  <tr align="center">
    <td colspan="2" valign="top"><em>(if possible please give a time window eg. '7th - 9th August' and we will arrange collection for you)</em></td>
    </tr>
    <tr>
    <td align="center">Delivery Date/Time:</td>
    <td align="center"><input type="text" name="deliverydt" id="Delivery Date/Time" /></td>
  </tr>
    <tr align="center">
      <td colspan="2" valign="top"><em>(if possible please give a time window eg. '7th - 9th August' and we will arrange delivery for you)</em></td>
      </tr>
  <tr>
    <td align="center">Is Vehicle Taxed:</td>
    <td align="center"><select name="Taxed" id="Is Vehicle Taxed">
          <option>Yes</option>
          <option selected="selected">No</option>
        </select></td>
  </tr>
  <tr>
    <td align="center">Is Vehicle roadworthy with full M.O.T.:</td>
    <td align="center"><select name="mot" id="Is Vehicle Roadworthy with Full M.O.T.">
          <option>Yes</option>
          <option selected="selected">No</option>
        </select></td>
  </tr>
  <tr>
    <td align="center">Billing Address:</td>
    <td align="center"><textarea name="billadd" rows="3" id="Billing Address"></textarea></td>
  </tr>
  <tr align="center">
    <td colspan="2" valign="top"><em>(if same as collection or delivery address please enter 'collection' or 'delivery')</em></td>
    </tr>
  <tr>
    <td align="center">Your Ref./Order No. (if any):</td>
    <td align="center"><input type="text" name="custordnum" id="Customer Ref./Order No." /></td>
  </tr>
  <tr>
    <td align="center">Any additional comments:</td>
    <td align="center"><textarea name="addcom" rows="3" id="Any additional comments"></textarea></td>
  </tr>
<tr align="center" valign="middle">
<td colspan="2">
  <p>
    <input type="checkbox" name="checkbox" id="checkbox" />
    I agree with the <u><a href="Terms.html">Terms and Conditions</a></u></strong></p>
  <p>&nbsp;</p></td>
  </tr>
<tr align="center">
  <td colspan="2"><input type="submit" name="button" id="button" value="Submit order" />
    <input type="reset" name="button2" id="button2" value="Reset form" /></td>
</tr>
  </table>
    </form>
  </div>
</div>
<div align="center"><img src="images/Booking_03.jpg" width="680" height="1352" border="0" usemap="#Map" />
  <map name="Map" id="Map">
    <area shape="rect" coords="36,155,158,173" href="index.html" alt="Home" />
    <area shape="rect" coords="29,174,151,189" href="Prices.html" alt="Prices" />
    <area shape="rect" coords="475,191,578,206" href="mailto:info@n-v-m.co.uk" alt="Email us" />
  </map>
</div>
</body>
</html>

PHP script (sendform.php)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <BODY>
  <?php

$Name = $_POST['name']; //senders name

$to = "info@n-v-m.co.uk"; //recipient
$subject = "Order from ".$_POST['company']." (".$_POST['name'].")"; //subject
$message = $_POST['company']."|".$_POST['name']."|".$_POST['phonenum']."|".$_POST['email']."|".$_POST['vmam']."|".$_POST['vreg']."|".$_POST['colladd']."|".$_POST['collconname']."|".$_POST['collconnum']."|".$_POST['deladd']."|".$_POST['delconname']."|".$_POST['delconnum']."|".$_POST['collectiondt']."|".$_POST['deliverydt']."|".$_POST['Taxed']."|".$_POST['billadd']."|".$_POST['custordnum']."|".$_POST['addcom']; //mail body
$from = "NVM Booking Form"; //
$headers = "From: ".$from."\r\n"; //optional headerfields
 
mail($to, $subject, $message, $headers); //mail command :) you can add any variable here... I know you have so many, but it is possible...
if(mail)
	echo "Okey! We Are Proceed. Thank You !";
else
	echo "Sorry We Can't Proceed, Please Try After Some Time!";
?>
</BODY>
</HTML>

Recommended Answers

All 5 Replies

I'll try
but you need to rethink the 'id's you have chosen

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>National Vehicle Movements - Booking Form</title>
<style type="text/css">
<!--
body { background-color: #1d255f; margin: 0; padding: 0; }
#apDiv1 {
position:absolute;
width:487px;
height:706px;
z-index:auto;
left: 50%;
top: 433px;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-align: center;
textarea-align: center;
background-position: center;
margin-left: -244px;
}
-->
</style>
<script type='text/javascript'>
function validatethis() {
if(!document.getelementById('Is Vehicle Roadworthy with Full M.O.T.').value='Yes') { Alert('The vehicle must be roadworthy with full M.O.T'); return false;}
if(!document.getelementById('checkbox').checked='checked') { Alert('You must agree to the Terms and Conditions'); return false;}
return true;}</script>
</head>
<body>
<div align="left">
<div id="apDiv1">
<form id="form1" name="form1" method="post" action="sendform.php" onsubmit='validatethis();'>
<table width="400" border="0" align="center">
<tr>
<td width="193" align="right">Company:</td>
<td width="197" ><input type="text" name="company" id="Company" /></td>
</tr>
<tr>
<td align="right">Name:</td>
<td ><input type="text" name="name" id="Name" /></td>
</tr>
<tr>
<td align="right">Phone Number:</td>
<td ><input type="text" name="phonenum" id="Phone Number" /></td>
</tr>
<tr>
<td align="right">Email Address:</td>
<td ><input type="text" name="email" id="Email" /></td>
</tr>
<tr>
<td align="right">Vehicle Make and Model:</td>
<td ><input type="text" name="vmam" id="Vehicle Make and Model" /></td>
</tr>
<tr>
<td align="right">Vehicle Reg./Ref. No.:</td>
<td><input type="text" name="vreg" id="Vehicle Reg." /></td>
</tr>
<tr>
<td align="right">Collection Address including Postcode:</td>
<td><textarea name="colladd" rows="4" id="Collection Address"></textarea></td>
</tr>
<tr>
<td align="right">Collection Contact Name:</td>
<td><input type="text" name="collconname" id="Collection Contact Name" /></td>
</tr>
<tr>
<td align="right">Collection Contact Number:</td>
<td><input type="text" name="collconnum" id="Collection Contact Number" /></td>
</tr>
<tr>
<td align="right">Delivery Address including Postcode:</td>
<td ><textarea name="deladd" rows="4" id="Delivery Address"></textarea></td>
</tr>
<tr>
<td align="right">Delivery Contact Name:</td>
<td><input type="text" name="delconname" id="Delivery Contact Name" /></td>
</tr>
<tr>
<td align="right">Delivery Contact Number:</td>
<td><input type="text" name="delconnum" id="Delivery Contact Number" /></td>
</tr>
<tr>
<td align="right">Collection Date/Time:</td>
<td><input type="text" name="collectiondt" id="Collection Date/Time" /></td>
</tr>
<tr>
<td colspan="2" valign="top" align='center'><em>(if possible please give a time window eg. '7th - 9th August' and we will arrange collection for you)</em></td>
</tr>
<tr>
<td align="right">Delivery Date/Time:</td>
<td><input type="text" name="deliverydt" id="Delivery Date/Time" /></td>
</tr>
<tr>
<td colspan="2" valign="top" align='center'><em>(if possible please give a time window eg. '7th - 9th August' and we will arrange delivery for you)</em></td>
</tr>
<tr>
<td align="right">Is Vehicle Taxed:</td>
<td><select name="Taxed" id="Is Vehicle Taxed">
<option>Yes</option>
<option selected="selected">No</option>
</select></td>
</tr>
<tr>
<td align="right">Is Vehicle roadworthy with full M.O.T.:</td>
<td><select name="mot" id="Is Vehicle Roadworthy with Full M.O.T.">
<option>Yes</option>
<option selected="selected">No</option>
</select></td>
</tr>
<tr>
<td align="right">Billing Address:</td>
<td><textarea name="billadd" rows="3" id="Billing Address"></textarea></td>
</tr>
<tr>
<td colspan="2" valign="top" align='center'><em>(if same as collection or delivery address please enter 'collection' or 'delivery')</em></td>
</tr>
<tr>
<td align="right">Your Ref./Order No. (if any):</td>
<td><input type="text" name="custordnum" id="Customer Ref./Order No." /></td>
</tr>
<tr>
<td align="right">Any additional comments:</td>
<td><textarea name="addcom" rows="3" id="Any additional comments"></textarea></td>
</tr>
<tr>
<td colspan="2" align="center" valign="middle">
<p>
<input type="checkbox" name="checkbox" id="checkbox" />
<label for='checkbox'>I agree with the <u><a href="Terms.html">Terms and Conditions</a></u></label></p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="2" align='center'><input type="submit" name="button" id="button" value="Submit order" />
<input type="reset" name="button2" id="button2" value="Reset form" /></td>
</tr>
</table>
</form>
</div>
</div>
<div align="center"><img src="images/Booking_03.jpg" width="680" height="1352" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="36,155,158,173" href="index.html" alt="Home" />
<area shape="rect" coords="29,174,151,189" href="Prices.html" alt="Prices" />
<area shape="rect" coords="475,191,578,206" href="mailto:info@n-v-m.co.uk" alt="Email us" />
</map>
</div>
</body>
</html>

0px is an invalid style that may throw browsers into quirks mode, 0px=0em=0%=0pt=0inch=0cm=$0=0lb0oz=0Kg= 0

other notes
fixed size fonts etc dont work, 10px is .09inch high on this monitor
current best practice for layout is ems and %, relative sizes that adjust to user basefont settings
if you set <table width='60%'><tr><td width='50%'></td><td width='50%'></td></tr></table> it will autoadjust
if you set fonts as 100% for regular text 125% for emphasis 85% for subscripts then the viewer will always be able to see the text in its designed layout, even if its a hires monitor with a basefont of 24px, or aunt Harriet who is visually impaired (blind as a bat) and has her basefont set to 72px

not going to mention that tables are a lousy layout tool, lot of code little content,
small steps towards css

Hi mate... this looks to be exactly the kind of thing I am looking for but unfortunately I have pasted the code into my Booking Form page and Dreamweaver is giving me the below error:

'There is a syntax error on line 28. Code hinting may not work until you fix this error.'

its screwed up
It works in a localhost on an ide
but does not work in IE FF Safari

<script type='text/javascript'>
function validatethis() {
var sel = document.getElementById('Is Vehicle Roadworthy with Full M.O.T.');
var sel2 = sel.options[sel.selectedIndex].value;
if(!(sel2 = 'Yes') ) { Alert('The vehicle must be roadworthy with full M.O.T'); return false;}
if(!(document.getelementById('checkboxx').checked ='on' )) { Alert('You must agree to the Terms and Conditions'); return false;}
return true;}
</script>

this code is better but still buggy
I only post it in case there is a guru with insight into what is wrong
I have to learn again

hi, i've tested the above and while there is no syntax error... it doesn't trigger the alert unfortunately!

I didn't test it out and I only did one of the inputs, but something like this should work:

<script type='text/javascript>
function isValid() {
var box = document.getElementById('Is Vehicle Roadworthy with Full M.O.T.');
if(box.value == 'no') {
alert('The vehicle must be roadworthy with full M.O.T');
return false;
}
}
</script>

put this on your submit button:

<input type="submit" name="button" id="button" value="Submit order" onclick="isValid()" />

Here is a link that might help you out too:

http://javascript.about.com/library/blvalsub2.htm

commented: Thanks +3
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.