Menu
I am having a problem doing these following instructions:
1.
[COLOR=Yellow]Add code for the “Save Pizza Details” button: This button should store the pizza details into the first available set of Hidden fields before clearing out the Toppings, Specialty Pizza, Crust and Special Instructions input items. This button should not affect values in the Name, Address or Phone fields. If all 3 sets of hidden fields have values, this button should not change any values on the form, but should Alert the user that 3 pizzas have been saved and let the user know he should click the “Order Pizza” button to submit his order.
Before allowing the form to be submitted to your email address, verify that at least 1 pizza details have been stored into the hidden fields.[/COLOR]Here is the JavaScript code:
[COLOR=Magenta]<script language=”JavaScript”>
var Pizza1=””,Pizza=””,Pizza3=””;
var Name=””,Phone=””,Address=””;
function checkMandatory()
{
//mandatory fields
var Name=document.getElementById(“Name_Field”).value;
var Address=document.getElementById(“Address_Field”).value;
var Phone=document.getElementById(“Phone_Field”).value;
if(Name.length==0)
{
alert(“Please enter your name”);
}
if (Address.length==0)
{
alert(“Please enter your address”);
}
if(Phone.length==0&&Phone.length!=7)
{
alert(“Please enter your phone number correctly”);
}
}
function SavePizzaDetails()
{
var Toppings=false;
var Specialty=false;
var holdPizza=’size=’;
for(i=0; i < document.forms[0].toppings.length;i++)
{
if(document.forms[0].toppings[i].checked==true)
{
Toppings=true;
holdPizza+= ” + document.forms[0].toppings[i].value;
}//end of if
if(Toppings)
{
holdPizza+=”;
//start loop with 1 so none is skipped
for(i=0;i <document.forms[0].Specialty.options.length;i++)
{
if(document.forms[0].Specialty.options[i].selected)
{
Specialty=true;
holdPizza+=” + document.forms[0].Specialty.options[i].text;
}//end of if statement
}//end of for loop
}// end of second if
//start loop with 1 so that None is skipped.
for(i=1;i<document.forms[0].Specialty.options.length;i++)
{
if(document.forms[0].Specialty.options[i].selected)
{
// variables
Specialty=true;
holdPizza+=”+ document.forms[0].Specialty.options[i].text;
}// end of if
}//end of second for loop
}//end of 3rd for loop
if(Specialty)
{
holdPizza+=”;
//either toppings should be choosen OR a specialty pizza selected, not both;
if(Specialty&&Toppings)
{
holdPizza=”;//erase stored Pizza Details
Validation=true;
alert(“Sorry, you are only able to choose toppings OR Specialty for Pizzann”+ “Please Try again”);
}// end of Specialty && Toppings if
}//end of Specialty if statement
}// end of Save Pizza Details Function
//function reset
function Reset()
{
document.forms[0].reset();
window.document.getElementById(“Name_Field”).value=Name;
window.document.getElememntById(“Phone_Field”).value=Phone;
window.document.getElementById(“Address_Field”).value=Address;
}
function DisplayForm()
{
alert(“Pizza1=” + document.forms[0].Pizza1.value + “/n”);
{
alert(“Click save Pizza Details before ordering Pizza!”);
//return false;}
//else
//return true;
}
}
</script>
Here is the HTML code:
<title>Ordering Pizza</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
</head>
<body>
<p>
<form method=”post” >
<p><font size=”+4″><strong><font color=”#000000″>Ordering Pizza </font><font size=”+4″><strong><font color=”#000000″><img src=”file:///E|/pizzahut.gif” width=”163″ height=”134″></font></strong></font></strong></font></p>
<p>Name:
<input type=”text” size=”20″ maxlength=”50″ id=”this.Name_Field” ></p>
<p>Address:
<input type=”text” size=”20″ maxlength=”50″ id=”Address_Field”></p>
<p>Phone:
<input type=”text” size=”20″ maxlength=”50″ id=”Phone_Field”>
<br>
<p><input name=”Pizza1″ type=”hidden” id=”Pizza1″></p>
<p><input name=”Pizza2″ type=”hidden” id=”Pizza2″></p>
<p><input name=”Pizza3″ type=”hidden” id=”Pizza3″></p>
</p>
<p><strong>Size:</strong></p>
<p>
<input type=”radio” name=”size” value=”small” id=”Size_Small”>
small
<input type=”radio” name=”size” value”=medium” id=”Size_Medium”>
medium
<input type=”radio” name=”size” value=”large” id=”Size_Large”>
large </p>
<p><strong>Toppings:</strong>:<br>
<input type=”checkbox” name=”toppings” id=”pepperoni”>
pepperoni
<input name=”toppings” type=”checkbox” id=”suasage”>
sausage
<input name=”toppings” type=”checkbox” id=”greenpeppers”>
green peppers
<input name=”toppings” type=”checkbox” id=”onions”>
onions </p>
<p>
<input name=”toppings” type=”checkbox” id=”mushrooms”>
mushrooms
<input name=”toppings” type=”checkbox” id=”olives”>
olives
<input name=”toppings” type=”checkbox” id=”octapus”>
octapus
<input name=”toppings” type=”checkbox” id=”seaweed”>
seaweed <strong> </strong></p>
<p><strong> or Chooose Speciality Pizza
<select name=”Specialty”>
<option>None</option>
<option>Pepper Steak</option>
<option>Barbecue Pizza</option>
</select>
</strong></p>
<p><strong>Crust:</strong><strong> </strong></p>
<p>
<select name=”crust”>
<option selected>Original</option>
<option>Large</option>
<option>XLarge</option>
</select>
</p>
<input name=”Pizza1″ type=”hidden” id=”Pizza1″ >
<input name=”Pizza2″ type=”hidden” id=”Pizza2″>
<input name=”Pizza3″ type=”hidden” id=”Pizza3″>
<p><strong> Special Instructions:</strong><br>
<textarea ref=”message”></textarea>
</p>
<p>
<input name=”order” type=”submit” value=”Order Pizza” onClick=”checkMandatory();”>
<input name=”clear” type=”button” value=”Clear_Form” onClick=”Reset();”>
<input name=”save” type=”button” value=”Save Pizza Details” onClick=”DisplayForm();”>
</p>
</form>
</p>
</body>
</html>
Please help me if you becuase it is something urgent I need to complete as soon as possible. The help will be appreciated. Thank you ?