[SOLVED] Validating Question

twilitegxa · November 7, 2008

Here is my working script so far:

<!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">
<head>
<title>Gosselin Gazette Subscription Form</title>
<meta http-equiv="content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="js_styles.css" type="text/css" />
<script type="text/javascript">
/*<![CDATA[ */
function checkForNumber(fieldValue) {
var numberCheck = isNaN(fieldValue);
if (numberCheck == true) {
	window.alert("You must enter a numeric value!");
	return false;
}
}

function confirmPassword() {
if (document.forms[0].password_confirm.value
	!= document.forms[0].password.value) {
	window.alert("You did not enter the same password!");
document.forms[0].password.focus();
}
}

function noDelivery() {
for (var i=0;i<document.forms[0].delivery.length;++i) {
	if (document.forms[0].delivery[i].checked == true)
		document.forms[0].delivery[i].checked = false;
}
}
function noSunday() {
for(var i=0;i<document.forms[0].sunday.length;++i) {
	if (document.forms[0].sunday[i].checked == true)
		document.forms[0].sunday[i].checked = false;
}
}

function sameShippingInfo() {
if (document.forms[0].elements[5].checked == true) {
	document.forms[0].name_shipping.value
		= document.forms[0].name_billing.value;
	document.forms[0].address_shipping.value
		= document.forms[0].address_billing.value;
	document.forms[0].city_shipping.value
		= document.forms[0].city_billing.value;
	document.forms[0].state_shipping.value
		= document.forms[0].state_billing.value;
	document.forms[0].zip_shipping.value
		= document.forms[0].zip_billing.value;
}
else {
	document.forms[0].name_shipping.value = "";
	document.forms[0].address_shipping.value = "";
	document.forms[0].city_shipping.value = "";
	document.forms[0].state_shipping.value = "";
	document.forms[0].zip_shipping.value = "";
}
}

function addMagazine() {
if (document.forms[0].elements[31].value == "")
	window.alert("You must enter a magazine name.");
else {
	var magazine = new Option();
	magazine.text = document.forms[0].elements[31].value;
	magazine.value = document.forms[0]
		.elements[31].value;
	nextItem = document.forms[0].magazines.length;
	document.forms[0].magazines.options[nextItem]
		= magazine;
	document.forms[0].elements[31].value = "";
}
}
function deleteMagazine() {
var selectedItem = 
	document.forms[0].magazines.selectedIndex;
if (selectedItem == -1)
	window.alert(
		"You must select a magazine name in the list.");
else
	document.forms[0].magazines.remove(selectedItem);
}
/*]]> */
</script>
</head>

<body>
<h1>Gosselin Gazette Subscription Form</h1>
<h2>Customer Information</h2>
<form action="FormProcessor.html" method="get"
enctype="application/x-www-form-urlencoded">
<table border="0">
<tr>
<td valign="top"><h3>Billing Information</h3>
<p>Name<br />
<input type="text" name="name_billing" size="50" /></p>
<p>Address<br />
<input type="text" name="address_billing" size="50" /></p>
<p>City, State, Zip<br />
<input type="text" name="city_billing" size="34" />
<input type="text" name="state_billing" size="2" maxlength="2" />
<input type="text" name="zip_billing" size="10"
maxlength="10" onchange="return checkForNumber(this.value);" /></p>
<p><input type="checkbox" onclick="sameShippingInfo();" />
Same shipping information</p></td>
<td valign="top">
<h3>Shipping Information</h3>
<p>Name<br />
<input type="text" name="name_shipping" size="50" /></p>
<p>Address<br />
<input type="text" name="address_shipping" size="50" /></p>
<p>City, State, Zip<br />
<input type="text" name="city_shipping" size="34" />
<input type="text" name="state_shipping" size="2"
maxlength="2" />
<input type="text" name="zip_shipping" size="10"
maxlength="5" onchange="return checkForNumber(this.value);" /></p></td></tr>
</table>
<p>Telephone</p>
<p>(<input type="text" name="area" size="3" maxlength="3" />)
<input type="text" name="exchange" size="3" maxlength="3" />
<input type="text" name="phone" size="4" maxlength="4" /></p>
<p>Enter a password that you can use to manage your subscription online:</p>
<p><input type="password" name="password" size="50" /></p>
<p>Type the password again to confirm it.</p>
<p><input type="password" name="password_confirm" size="50"
onblur="confirmPassword();" /></p>
<h3>Delivery Rates</h3>
<table border="0">
<colgroup align="left" width="150" />
<colgroup span="4" align="center" width="130" />
<tr><th> </th>
<th>4 weeks</th>
<th>13 weeks</th>
<th>26 weeks</th>
<th>52 weeks</th></tr>
<tr><td><strong>Mon-Sat</strong></td>
<td><input type="radio" name="delivery"
value="12.60" onclick="noSunday();" />$12.60</td>
<td><input type="radio" name="delivery"
value="40.95" onclick="noSunday();" />$40.95</td>
<td><input type="radio" name="delivery"
value="81.90" onclick="noSunday();" />$81.90</td>
<td><input type="radio" name="delivery"
value="156.00" onclick="noSunday();" />$156.00</td></tr>
<tr><td><strong>Every Day</strong></td>
<td><input type="radio" name="delivery"
value="13.56" onclick="noSunday();" />$13.56</td>
<td><input type="radio" name="delivery"
value="44.07" onclick="noSunday();" />$44.07</td>
<td><input type="radio" name="delivery"
value="88.14" onclick="noSunday();" />$88.14</td>
<td><input type="radio" name="delivery"
value="159.74" onclick="noSunday();" />$159.74</td></tr>
</table>
<p><strong>Sundays only ($3.50 per week)</strong>
<input type="radio" name="sunday" value="weekly"
onclick="noDelivery();" />Bill me weekly
<input type="radio" name="sunday" value="weekly"
onclick="noDelivery();" />Bill me monthly</p>
<p>Do you subscribe to any other newspapers?</p>
<p><input type="checkbox" name="newspapers"
value="nytimes" />New York Times<br />
<input type="checkbox" name="newspapers"
value="bostonglobe" />Boston Globe<br />
<input type="checkbox" name="newspapers"
value="sfchronicle" />San Francisco Chronicle<br />
<input type="checkbox" name="newspapers"
value="miamiherald" />Miami Herald<br />
<input type="checkbox" name="newspapers"
value="other" />Other</p>
<p>Do you subscribe to any magazines?</p>
<p>Magazine <input type="text" size="68" /></p>
<p><input type="button" value="Add Magazine"
onclick="addMagazine();" style="width: 120px" />
<input type="button" value="Delete Magazine"
onclick="deleteMagazine()" style="width: 120px" />
<input type="button" value="Clear List"
onclick="document.forms[0].magazines.options.length = 0;"
style="width: 120px" />
<input type="button" value="Change Magazine"
onclick="changeMagazine()" style="width: 120px" /></p>
<p><select name="magazines" multiple="multiple"
size="10" style="width: 500px">
<option value="none">Enter the magazine you subscribe 
to</option>
</select></p>
<p><input type="image" alt="Graphical image of a subscribe
button" src="subscribe.gif" /></p>
<p><input type="reset" /></p>
</form>
</body>
</html>

I am working from a tutorial in a book, and it says this as the next instruction, but I cannot get it to work properly:

Finally, add the following if statement to the beginning of the else statement in the addMagazine() function. This statement deletes the "Enter the magazines you subscribe to" option that is displayed by default in the selection list.

if (document.forms[0].magazines.options[0]
        && (document.forms[0].magazines.options[0].value == "none")
                document.forms[0].magazines.options[0] = null;

Can anyone tell me where I need to add this script exactly? Everywhere I add it, the button stops working.

xtopolis · November 8, 2008

It was missing a ")" at the end. Notice there should be 2 ") by "none". If you use Firefox's Error Console, it will show you Javascript errors.

function addMagazine() {
if (document.forms[0].magazines.options[0]
        && (document.forms[0].magazines.options[0].value == "none"))
                document.forms[0].magazines.options[0] = null;

   if (document.forms[0].elements[31].value == "")
      window.alert("You must enter a magazine name.");
   else {
...

twilitegxa · November 8, 2008

Thanks, that worked perfectly!

Sign In

[SOLVED] Validating Question

Recommended Posts

twilitegxa

Link to comment

Share on other sites

xtopolis

Link to comment

Share on other sites

twilitegxa

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information