Chapter ZIP
This commit is contained in:
		
							
								
								
									
										95
									
								
								Chapter ZIPs/JavaScript/ch6/ex_6_11.html
									
									
									
									
									
										Executable file
									
								
							
							
						
						
									
										95
									
								
								Chapter ZIPs/JavaScript/ch6/ex_6_11.html
									
									
									
									
									
										Executable file
									
								
							@@ -0,0 +1,95 @@
 | 
			
		||||
<html>
 | 
			
		||||
<head>
 | 
			
		||||
<title>Example 6.11</title>
 | 
			
		||||
<script>
 | 
			
		||||
function pickEntree(picked)
 | 
			
		||||
{
 | 
			
		||||
	var entree = document.getElementById(picked).value;
 | 
			
		||||
	document.getElementById('main_dish').innerHTML = entree;
 | 
			
		||||
}
 | 
			
		||||
function customerInfo(cName)
 | 
			
		||||
{
 | 
			
		||||
	var dinerName = document.getElementById(cName).value;
 | 
			
		||||
	document.getElementById('cust_name').innerHTML = dinerName;
 | 
			
		||||
}
 | 
			
		||||
function customerPhone(cell)
 | 
			
		||||
{
 | 
			
		||||
	var phone = document.getElementById(cell).value;
 | 
			
		||||
	document.getElementById('cell_phone').innerHTML = phone;
 | 
			
		||||
}
 | 
			
		||||
function pickSides()
 | 
			
		||||
{
 | 
			
		||||
	var flag = false;
 | 
			
		||||
	var i =0;
 | 
			
		||||
	var side1 = "";
 | 
			
		||||
	var side2 = "";
 | 
			
		||||
	for (i = 1; i <= 7; i++)
 | 
			
		||||
	{
 | 
			
		||||
		if ((document.getElementById(i).checked == true) && (flag == false))
 | 
			
		||||
		{
 | 
			
		||||
			side1 = document.getElementById(i).value;
 | 
			
		||||
			flag = true;
 | 
			
		||||
		}
 | 
			
		||||
		else if ((document.getElementById(i).checked == true) && (flag == true))
 | 
			
		||||
			side2 = document.getElementById(i).value;
 | 
			
		||||
		
 | 
			
		||||
	}
 | 
			
		||||
	document.getElementById('side_one').innerHTML = side1;
 | 
			
		||||
	document.getElementById('side_two').innerHTML = side2;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
</script>
 | 
			
		||||
<style type="text/css">
 | 
			
		||||
<!--
 | 
			
		||||
body {
 | 
			
		||||
	margin: 5%;
 | 
			
		||||
}
 | 
			
		||||
-->
 | 
			
		||||
</style>
 | 
			
		||||
</head>
 | 
			
		||||
 | 
			
		||||
<body>
 | 
			
		||||
<form name="order" method = "post" id = "dinner" action="mailto:manager@mealstogo.net?subject=Dinner Order" enctype="text/plain" >
 | 
			
		||||
<input type ="hidden" name ="meal" id ="dinner" value = "dinner choice" />
 | 
			
		||||
<h2><br />Select Your Meal</h2>
 | 
			
		||||
<div style="width: 80%;">
 | 
			
		||||
<div style="width: 40%; float: left;">
 | 
			
		||||
<fieldset><legend>Your Information</legend>
 | 
			
		||||
<h3>Enter the following information:</h3>
 | 
			
		||||
    <label>Your name:<br /></label> <input type="text" name="dinername" id="dinername" size = "30" value = ""/>
 | 
			
		||||
	<input type ="button" onclick="customerInfo('dinername')" value = "ok"></button>
 | 
			
		||||
	<p>We will call your cell phone when your order is ready.<br /> 
 | 
			
		||||
	<label>Phone:<br /> </label><input type="text" name="phone" id="phone" size="30" value = ""/></label>
 | 
			
		||||
  <input type ="button" onclick="customerPhone('phone')" value = "ok"></button><br /></fieldset></div>
 | 
			
		||||
<div style=" width: 30%; float: left;"><fieldset><legend>Main Course</legend>
 | 
			
		||||
	<h3>Pick your main course:</h3>
 | 
			
		||||
	    <input type="radio" name="entree" id="steak" value="Rib-Eye Steak" onclick="pickEntree('steak')">Rib-Eye Steak<br />
 | 
			
		||||
		<input type="radio" name="entree" id="chicken" value="Fried Chicken" onclick="pickEntree('chicken')">Fried Chicken<br />
 | 
			
		||||
		<input type="radio" name="entree" id="veggie" value="Veggie Platter" onclick="pickEntree('veggie')">Vegetarian Fried Tofu<br />
 | 
			
		||||
		<input type="radio" name="entree" id="fish" value="Broiled Salmon" onclick="pickEntree('fish')">Broiled Salmon<br /><br />
 | 
			
		||||
  </fieldset></div>
 | 
			
		||||
<div style="width: 30%; float: left;"><fieldset><legend>Side Dishes</legend>
 | 
			
		||||
		<h3>Pick two side dishes</h3>
 | 
			
		||||
		<input type="checkbox" name="sides" id="1" value="French Fries" >French Fries<br />
 | 
			
		||||
		<input type="checkbox" name="sides" id="2" value="Baked Potato">Baked Potato<br />
 | 
			
		||||
		<input type="checkbox" name="sides" id="3" value="Cole Slaw">Cole Slaw<br />
 | 
			
		||||
		<input type="checkbox" name="sides" id="4" value="Garden Salad">Garden Salad<br />
 | 
			
		||||
		<input type="checkbox" name="sides" id="5" value="Mixed Vegetables">Mixed Vegetables<br />
 | 
			
		||||
		<input type="checkbox" name="sides" id="6" value="Macaroni and Cheese">Macaroni and Cheese<br />
 | 
			
		||||
		<input type="checkbox" name="sides" id="7" value="Applesauce">Applesauce<br />
 | 
			
		||||
		<input type ="button" onclick="pickSides()" value = "Enter my side dish selections" "></button></fieldset></div>
 | 
			
		||||
		</div>
 | 
			
		||||
  <div style="clear:both;"></div>
 | 
			
		||||
<div ><input type="reset" value="ooops! I made a mistake. Let me start over."><br /></div>
 | 
			
		||||
<div style="width: 40%; float: left;"><h3>Your meal:</h3>
 | 
			
		||||
<p>Your name: <span  id = "cust_name"> </span> <br />
 | 
			
		||||
Your contact phone: <span  id = "cell_phone"> </span> <br />
 | 
			
		||||
Entree selected: <span  id = "main_dish"> </span> <br />
 | 
			
		||||
First side dish selected: <span  id = "side_one"> </span> <br />
 | 
			
		||||
Second side dish selected: <span  id = "side_two"> </span> </p></div>
 | 
			
		||||
<div style="width: 40%; float: left;"><h3>Comments or questions:</h3>
 | 
			
		||||
<textarea name = "dinnerorder" id = "dinner" rows = "6" cols = "40">Enter your comments or questions here</textarea> </div><div style="clear:both;"></div>
 | 
			
		||||
<div><input type = "submit" value="submit my order"><br /></div>
 | 
			
		||||
</form>
 | 
			
		||||
</body>
 | 
			
		||||
</html>
 | 
			
		||||
		Reference in New Issue
	
	Block a user