Menu
I have the following code. When I click submit, it tells me “validate_form is not defined.” Can you tell me what’s wrong and how to fix it? When all the fields are filled in correctly, I need a pop-up box to come up that confirms the book selected and the quantity. I don’t know how to do this at all.
[CODE]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”en” lang=”en”>
<head>
<title>Book Order Form</title>
<style type=”text/css”>
* {
margin:0px;
padding:0px;
font-family:’Times New Roman’, sans-serif;
font-size:16px;
color:#333333;
font-weight: bold;
}
.container {
width:500px;
background-color:#fff;
margin:10px auto;
text-align:center;
border:2px solid #CDC9A5;
overflow:hidden;
}
.basic {
display:block;
text-align:left;
background-color:#999999;
padding:2px 0px;
}
.formHoldersL:first-child {
border-top:0px;
}
.formHoldersL {
display:block;
width:188px;
float:left;
text-align:left;
padding:4px 17px;
border-top:2px solid #CDC9A5;
height:inherit;
}
.formHoldersR:first-child {
border:0px;
}
.formHoldersR {
display:block;
width:275px;
float:right;
text-align:left;
padding:0px;
border-top:2px solid #CDC9A5;
border-left:2px solid #CDC9A5;
height:inherit;
}
.clear {
clear:both;
}
.button {
border-top:2px solid #CDC9A5;
}
</style>
<script type=”text/JavaScript”>
function validate_form() {
var error_msg = “”;
var form = document.form;
if (form.books.selectedIndex==0)
error_msg += “Please select your book.n”;
}
if (form.Qty.value==””)
error_msg += “Please fill in the ‘Qty’ box.n”;
}
if (form.name.value==””)
error_msg += “Please fill in the ‘Name’ box.n”;
}
if (form.address.value==””)
error_msg += “Please fill in the ‘Address’ box.n”;
}
if (form.zipcode.value==””)
error_msg += “Please fill in the ‘Zip Code’ box.n”;
}
if (form.state.value==””)
error_msg += “Please fill in the ‘State’ box.n”;
}
if (form.phone.value==””)
error_msg += “Please fill in the ‘Phone’ box.n”;
}
if (form.email.value==””)
error_msg += “Please fill in the ‘Email’ box.n”;
}
if (form.email.value.matches(/^[A-Z0-9._%+-]+@[A-Z0-9.-]+.[A-Z]{2,4}$/i) == false )
error_msg = “Please put in a properly-formatted email address.n”;
}
if (form.Qty.value.matches(/^[1-9]d*$/) == false )
error_msg = “Please put in a quantity great than 0. n”;
}
if( error_msg != “” )
alert(error_msg);
return (error_msg == “”);
}
</script>
</head>
<body>
<form method=”post” action=”post” onsubmit=”validate_form()”>
<div class=”container”>
<div class=”basic”>Online Bookstore</div>
<div class=”formHoldersL”>Select the book</div>
<div class=”formHoldersR”><select name=”books”>
<option>Javascript Book</option>
<option>Java Language Book</option>
<option>VBScript Book</option>
<option>Advanced Programming in Java</option>
<option>Data Structures in C++</option>
<option>Perl and CGI</option>
</select></div>
<div class=”clear”></div>
<div class=”formHoldersL”>Qty</div>
<div class=”formHoldersR”><input name=”Qty” type=”text” size=”20″ /></div>
<div class=”clear”></div>
<div class=”formHoldersL”>Do you want a free subscription to the newsletter?</div>
<div class=”formHoldersR”><input name=”newsletter” type=”radio” value=”yes” /> Yes <input name=”newsletter” type=”radio” value=”no” /> No
<p> </p></div>
<div class=”clear”></div>
<div class=”formHoldersL”>Free Information Book List:</div>
<div class=”formHoldersR”><select name=”information” size=”5″>
<option>Internet Books</option>
<option>Programming Languages</option>
<option>Networking Books</option>
<option>Internet Security Books</option>
<option>Scripting Books</option>
<option>Application Design Books</option>
</select></div>
<div class=”clear”></div>
<div class=”basic”>Delivery Information</div>
<div class=”clear”></div>
<div class=”formHoldersL”>Name</div>
<div class=”formHoldersR”><input name=”name” type=”text” size=”20″ /></div>
<div class=”clear”></div>
<div class=”formHoldersL”>Address</div>
<div class=”formHoldersR”><input name=”address” type=”text” size=”20″ /></div>
<div class=”clear”></div>
<div class=”formHoldersL”>ZipCode</div>
<div class=”formHoldersR”><input name=”zipcode” type=”text” size=”20″ /></div>
<div class=”clear”></div>
<div class=”formHoldersL”>State</div>
<div class=”formHoldersR”><input name=”state” type=”text” size=”20″ /></div>
<div class=”clear”></div>
<div class=”formHoldersL”>Phone</div>
<div class=”formHoldersR”><input name=”phone” type=”text” size=”20″ /></div>
<div class=”clear”></div>
<div class=”formHoldersL”>Email</div>
<div class=”formHoldersR”><input name=”email” type=”text” size=”20″ /></div>
<div class=”clear”></div>
<div class=”button”><input type=”submit” value=”Submit”/><input type=”reset” /></div>
<div class=”clear”></div>
</div>
</form>
</body>
</html>