here is my JS code
Code:
function validate() {
//this declares that this function is called validate
var pcodee;
pcodee = 0;
pcodee = parseFloat(orderform.pcode.value);
/*These next few lines declare pcodee as a variable and then set the variable as 0.
the line after that goes to the form and gets the pcode value and converts the string to a floating number(numeric) so it
can later be checked if it is a number or not */
if (orderform.user.value==""){
alert("Please enter your Name");
return valid=false;
}
if (orderform.add.value==""){
alert("Please enter your Address");
return valid=false;
}
if (orderform.suburb.value==""){
alert("Please enter your Suburb");
return valid=false;
}
/*The first 3 IF's check the first 3 text boxes in the form to see if they have had anything entered, and if not then an alert box will show telling the user
to enter something and then it will stop the javascript which makes it so the user does not get baraged with alert boxes just one*/
if (orderform.pcode.value.length !=4 || isNaN(pcodee) ){
/*This line checks that first of all the postcode is not 4 numbers in length and/or it is not a number.
if either of these are true then the next few lines will make the alert box show and the JS will stop as with the other If's*/
alert("You must Enter a Post code of 4 Numbers");
return valid=false;
}
if (orderform.email.value.indexOf("@") == -1 || orderform.email.value.indexOf(".") == -1 ){
/* With this Line it checks the email text box to see if it doesnt have an "@" or an "." and if it doesnt have one or the other or both of these
then the next couple of lines will tell the user that the email inputted needs to be valid and again it will stop the code, what stopping the code also does it
stops the form from being submitted to the processing, once all validation checks are clear, this being the last one the infomation will then be sent
along to be processed */
alert("You must Enter a valid email address");
return valid=false;
}
}
function openhelp(){
window.open("help.html","_blank","width=400, height=400")
}
And here is my HTML code
Code:
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" type="text/css" href="css/yeh.css" />
<title>Order Form</title>
<script type="text/javascript" src="../javascript/formvalid.js"> </script>
</head>
<body>
<a name="top" />
<br />
<div id="heading" align="center">
<img src="../images/joes_header.jpg" alt="Joes Fruit Shop" vspace="30" /></div>
<div id="menu" align="center">
<img src="../images/berry01_red.gif" alt="Berry" /><p />
<a href="home.html" title="Home">Home</a>
<p />
<img src="../images/berry01_red.gif" alt="Berry" /><p />
<a href="produce.html">Produce</a>
<p />
<img src="../images/berry01_red.gif" alt="Berry" /><p />
<p><a href="html/history.html" title="History">History</a></p>
<p> </p>
</div>
<div id="main" align="center"> <br />
<h1>Make an Order</h1> <br />
<form name="orderform" method="post" action="http://www.mydomain.com/process.php" onsubmit="return validate(this);">
* Name: <input type="text" name="user" value="" size="30" /> * Email Address: <input type="text" id="email" value="" size="60" /><br />
* Address: <input type="text" name="add" value="" size="40" />
* Suburb: <input type="text" name="suburb" value="" size="20" /> * Postcode: <input type="text" id="pcode" value="" size="4" /><br />
<br />
Orders: <br />
<textarea name="textarea" cols="80" rows="6"></textarea>
<br />
<hr />
Credit Card Details:<br />
* Type: <select name="cctype">
<option id="AM" value="amex">AMEX</option>
<option id="VI" value="visa">Visa</option>
<option id="MC" value="mastercard">MasterCard</option>
<option id="DC" value="dinersclub">Diners Club</option>
<option id="BC" value="bankcard">BankCard</option>
</select>
* Expiry Date
<select name="edmonth">
<option id="id1" value="01">01</option>
<option id="id2" value="02">02</option>
<option id="id3" value="03">03</option>
<option id="id4" value="04">04</option>
<option id="id5" value="05">05</option>
<option id="id6" value="06">06</option>
<option id="id7" value="07">07</option>
<option id="id8" value="08">08</option>
<option id="id9" value="09">09</option>
<option id="id10" value="10">10</option>
<option id="id11" value="11">11</option>
<option id="id12" value="12">12</option>
</select>
<select name="edyear">
<option id="idi2006" value="2006">2006</option>
<option id="id2007" value="2007">2007</option>
<option id="id2008" value="2008">2008</option>
<option id="id2009" value="2009">2009</option>
</select>
<hr />
<input type="submit" name="send" value="Submit" /> <input type="reset" value="Clear Form" />
</form>
<form method="get" action="">
<input type="submit" value="Help" onclick="openhelp();" />
</form>
<div align="center"> | <a href="contact.html" title="Contact Us">Contact Us</a> | <a href="html/copyright.html" title="Copyright" target="_blank">Copyright</a> | <a href="html/privacy.html" title="Privacy" target="_blank">Privacy</a> | <a href="mailto:grape_moosha@hotmail.com?subject=Joe's Website Query" title="Email The Web Administrator">Web Administrator</a> |
</div> </div>
</body>
</html>