I'm working on an assignment and have hit a wall.
I'm trying to display the check box values for toppings in the alert box pop-up screen once submitted. The text box and radio values appear but check box returns a blank value.
Any idea what I'm doing wrong?
<html>
<head>
<title>HTML and JavaScript</title>
<script>
function doClear()
{
document.PizzaForm.customer.value ="";
document.PizzaForm.address.value = "";
document.PizzaForm.city.value = "";
document.PizzaForm.state.value="";
document.PizzaForm.zip.value="";
document.PizzaForm.phone.value="";
document.PizzaForm.email.value="";
document.PizzaForm.sizes[0].checked = false;
document.PizzaForm.sizes[1].checked = false;
document.PizzaForm.sizes[2].checked = false;
document.PizzaForm.sizes[3].checked = false;
document.PizzaForm.toppings[0].checked = false;
document.PizzaForm.toppings[1].checked = false;
document.PizzaForm.toppings[2].checked = false;
document.PizzaForm.toppings[3].checked = false;
document.PizzaForm.toppings[4].checked = false;
document.PizzaForm.toppings[5].checked = false;
document.PizzaForm.toppings[6].checked = false;
document.PizzaForm.toppings[7].checked = false;
document.PizzaForm.toppings[8].checked = false;
return;
}
function doSubmit()
{
if(validateText() == true);
if(validateRadio() == true);
if(validateCheck() == true);
alert("Name:" + " " + document.PizzaForm.customer.value +
'\n' +
"Address:" + " " + document.PizzaForm.address.value +
'\n' +
"City:" + " " + document.PizzaForm.city.value +
'\n' +
"State:" + " " + document.PizzaForm.state.value +
'\n' +
"Zip:" + " " + document.PizzaForm.zip.value +
'\n' +
"Phone:" + " " + document.PizzaForm.phone.value +
'\n' +
"Email:" + " " + document.PizzaForm.email.value +
'\n' +
"Size:" + " " + document.PizzaForm.sizes.value +
'\n' +
"Toppings:" + " " + document.PizzaForm.toppings.value);
return;
}
function validateText()
{
var customer = document.PizzaForm.customer.value;
if (customer.length == 0)
{
alert("Please enter your name.")
}
var address = document.PizzaForm.address.value;
if (address.length == 0)
{
alert("Please enter an address.")
}
var city = document.PizzaForm.city.value;
if (city.length == 0)
{
alert("Please enter a city.")
}
var state = document.PizzaForm.state.value;
if (state.length == 0)
{
alert("Please enter a state.")
}
var zip = document.PizzaForm.zip.value;
if (zip.length == 0)
{
alert("Please enter a zip code.")
}
var phone = document.PizzaForm.phone.value;
if (phone.length == 0)
{
alert("Please enter a phone number.")
}
var email = document.PizzaForm.email.value;
atpos = email.indexOf("@");
dotpos = email.lastIndexOf(".");
if (atpos < 1 || ( dotpos - atpos < 2 ))
{
alert("Please enter an email address.")
return false;
}
return true;
}
function validateRadio()
{
if (document.PizzaForm.sizes[0].checked) return true;
if (document.PizzaForm.sizes[1].checked) return true;
if (document.PizzaForm.sizes[2].checked) return true;
if (document.PizzaForm.sizes[3].checked) return true;
if (document.PizzaForm.sizes.value == false);
{
alert("Please choose a pizza size.");
}
return;
}
function validateCheck()
{
if (document.PizzaForm.toppings[0].checked == false &&
document.PizzaForm.toppings[1].checked == false &&
document.PizzaForm.toppings[2].checked == false &&
document.PizzaForm.toppings[3].checked == false &&
document.PizzaForm.toppings[4].checked == false &&
document.PizzaForm.toppings[5].checked == false &&
document.PizzaForm.toppings[6].checked == false &&
document.PizzaForm.toppings[7].checked == false &&
document.PizzaForm.toppings[8].checked == false)
{
alert("Please pick a topping of your choice.");
}
return false;
return true;
}
</script>
</head>
<body>
<form name="PizzaForm">
<h1>The JavaScript Pizza Parlor</h1>
<p>
<h4>Step 1: Enter your name, address, and phone number:</h4>
<font face ="Courier New">
Name: <input name="customer" size="50" type="text"><br>
Address: <input name="address" size"50" type="text"><br>
City: <input name="city" size="15" type="text">
State: <input name="state" size="2" type="TEXT">
Zip: <input name="zip" size="5" type="text"><br>
Phone: <input name="phone" size="50" type="text"><br>
Email: <input name="email" size="40" type="text"><br>
</font>
</p>
<p>
<h4>Step 2: Select the size of pizza you want:</h4>
<font face="Courier New">
<input name="sizes" type="radio" value="Small">Small
<input name="sizes" type="radio" value="Medium">Medium
<input name="sizes" type="radio" value="Large">Large
<input name="sizes" type="radio" value="Jumbo">Jumbo<br>
</font>
</p>
<p>
<h4>Step 3: Select the pizza toppings you want:</h4>
<font face="Courier New">
<input name="toppings" type="checkbox" value="Pepperoni">Pepperoni
<input name="toppings" type="checkbox" value="Canadian Bacon">Canadian Bacon
<input name="toppings" type="checkbox" value="Sausage">Sausage<br>
<input name="toppings" type="checkbox" value="Mushrooms">Mushrooms
<input name="toppings" type="checkbox" value="Pineapple">Pineapple
<input name="toppings" type="checkbox" value="Black Olives">Black Olives<br>
<input name="toppings" type="checkbox" value="Green Peppers">Green Peppers
<input name="toppings" type="checkbox" value="Extra Cheese">Extra Cheese
<input name="toppings" type="checkbox" value="None">None<br>
</font>
</p>
<input type="button" value="Submit Order" onClick="doSubmit()">
<input type="button" value="Clear Entries" onClick="doClear()">
</form>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire