Please I need to edit two things in this pizza page, 1 there is a questions asks
ID: 3729048 • Letter: P
Question
Please I need to edit two things in this pizza page,
1 there is a questions asks the user if you wants to be added to our emailing list?
if the user click yes, he will see at the end when he submit the order the the follwoing message, Thank you, you have been added to our email list+the email the user enterd.
2-I want also the user to see the chosen pizza size.
this the code
<!DOCTYPE html>
<html>
<head>
<title>Chicago Mediterranean Pizza</title>
</head>
<body bgcolor="gold">
<script>
var PIZ, DRK, DSRT;
function The_Total() {
var inputField1, inputField2, inputField3, values;
PIZ = Number(document.getElementById("PIZ").value);
DRK = Number(document.getElementById("DRK").value);
DSRT = Number(document.getElementById("DSRT").value);
values = 0;
toppings = "";
if (document.PizzaToppings.checkgroup[0].checked) {
toppings += "Mushrooms ";
values = values + Number(document.PizzaToppings.checkgroup[0].value);
}
if (document.PizzaToppings.checkgroup[1].checked) {
toppings += "Sausages ";
values = values + Number(document.PizzaToppings.checkgroup[1].value);
}
if (document.PizzaToppings.checkgroup[2].checked) {
toppings += "Olives ";
values = values + Number(document.PizzaToppings.checkgroup[2].value);
}
result = (PIZ + DRK + DSRT + values);
inputField1 = document.getElementById("txtName").value;
inputField2 = document.getElementById("txtAdd").value;
inputField3 = document.getElementById("txtPh").value;
document.getElementById("p1").innerHTML = "Thank you : " + inputField1;
document.getElementById("p2").innerHTML = "We have your address as: " + inputField2;
document.getElementById("p3").innerHTML = "Your phone number is: " + inputField3;
document.getElementById("p5").innerHTML = "Your total is " + result + "$"
document.getElementById("orders").innerHTML = "You ordered <br /> Pizzas: " + PIZ + " Drinks:" + DRK + " Desert Plates: " + DSRT;
document.getElementById("pizza_toppings").innerHTML = "Pizza Toppings: " + (toppings ? toppings : "None");
document.getElementById("spec_requests").innerHTML = "Special Requests: "+ document.getElementById("spec_req").value;
if (result >= 25) {
document.getElementById("p6").innerHTML =
"Congratulations, you have earned a free medium pizza with your next order and the code for it is Q1358"
}
else {
document.getElementById("p6").style.display = "none";
}
document.getElementById("p4").innerHTML = formatDate(new Date());
}
function formatDate(date) {
var day = date.getDate();
var month = date.getMonth()+1;
var year = date.getFullYear();
var hours = date.getHours() > 12 ? date.getHours() - 12 : date.getHours();
var am_pm = date.getHours() >= 12 ? "PM" : "AM";
hours = hours < 10 ? "0" + hours : hours;
hours = hours == 0 ? "12" : hours;
var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
time = hours + ":" + minutes + ":" + seconds + " " + am_pm;
return day + '/' + month + '/' + year + ' at ' + time;
}
</script>
<link rel="stylesheet" type="text/css" href="styleforgolden.css">
<div class="header">
<header>
<img src="GoldPizza.jpg">
<h1>Chicago Mediterranean Pizza </h1>
</header>
<h3>An American Pizza with a Middle Eastern taste!</h3>
</div>
<div class="main">
<h4>Start Your Order!</h4>
<form>
<p>Name:
<input type="text" id="txtName">
</p>
<p>Address:
<input type="text" id="txtAdd">
</p>
<p>Phone:
<input type="text" id="txtPh">
<p>Email:
<input type="text" id="Emailph">
</p>
</form>
Would you like to be added to our e-mailing list for specials offers?
<br/> Yes:
<input type="radio" name="radTerms" checked />
<br/> No:
<input type="radio" name="radTerms" />
<br/>
<form>
<p>Choses Your Pizza Size:"</p>
<p>
<select id="PIZ">
<option value="10">Small ($10)</option>
<option value="13">Medium ($13)</option>
<option value="16">Large ($16)</option>
<option value="20">Extra Large($20)</option>
</select>
</p>
<p>Do You Want Drinks? </p>
<p>
<select id="DRK">
<option value="0">( 0 )</option>
<option value="1">(1 Drink for $1)</option>
<option value="2">(2 Drinks for $2)</option>
<option value="3">(3 Drinks for $3)</option>
<option value="4">(4 Drinks for $4)</option>
</select>
</p>
<p>Do You Want any Deserts Plates? </p>
<p>
<select id="DSRT">
<option value=0>( 0 )</option>
<option value=3>(1 Plate for $3)</option>
<option value=6>(2 Plates for $6)</option>
<option value=9>(3 Plates for $9)</option>
<option value=12>(4 Plates for $12)</option>
</select>
</p>
</form>
<form name="PizzaToppings">
<p>Pick Your Toppings: 50 cents each</p>
<p>Mushrooms:
<input type="checkbox" name="checkgroup" value=0.50>
</p>
<p>Sausage:
<input type="checkbox" name="checkgroup" value=0.50>
</p>
<p>Olives:
<input type="checkbox" name="checkgroup" value=0.50>
</p>
</form>
<form>
<p>Special requests?
<textarea name="" col="25" rows="5" id="spec_req"></textarea>
</p>
</form>
<form>
<input class="button button1" type="button" value="Submit My Order">
<p id="p1"></p>
<p id="p2"></p>
<p id="p3"></p>
<p id="p5"></p>
<p id="orders"></p>
<p id="pizza_toppings"></p>
<p id="spec_requests"></p>
<p id="p6"></p>
<p id="p4"></p>
</form>
</div>
<div class="footer" face="arial">
<i><h6>Chicago Mediterranean Pizza </h6></i>
<i><h6>3859 W Ogden Ave, Chicago, IL 60623 </h6></i>
<i><h6>708-307-2243 </h6></i>
</div>
</body>
</html>
Explanation / Answer
<!DOCTYPE html>
<html>
<head>
<title>Chicago Mediterranean Pizza</title>
</head>
<body bgcolor="gold">
<script>
var PIZ, DRK, DSRT;
function The_Total() {
var inputField1, inputField2, inputField3, values;
PIZ = Number(document.getElementById("PIZ").value);
DRK = Number(document.getElementById("DRK").value);
DSRT = Number(document.getElementById("DSRT").value);
values = 0;
toppings = "";
psize="";
if (document.PizzaToppings.checkgroup[0].checked) {
toppings += "Mushrooms ";
values = values + Number(document.PizzaToppings.checkgroup[0].value);
}
if (document.PizzaToppings.checkgroup[1].checked) {
toppings += "Sausages ";
values = values + Number(document.PizzaToppings.checkgroup[1].value);
}
if (document.PizzaToppings.checkgroup[2].checked) {
toppings += "Olives ";
values = values + Number(document.PizzaToppings.checkgroup[2].value);
}
result = (PIZ + DRK + DSRT + values);
if(PIZ==10)
psize="Small ($10)";
else if(PIZ==13)
psize="Medium ($13)";
else if(PIZ==16)
psize="Large ($16)";
else if(PIZ==20)
psize="Extra Large ($20)";
inputField1 = document.getElementById("txtName").value;
inputField2 = document.getElementById("txtAdd").value;
inputField3 = document.getElementById("txtPh").value;
phone=document.getElementById("Emailph").value;
var rates = document.getElementById('rad').value;
var rate_value;
if(rates =='yes'){
rate_value = document.getElementById('r1').value;
}
document.getElementById("p7").innerHTML = "Thank you, you have been added to our email list "+phone;
document.getElementById("p8").innerHTML = "The chosen pizza size: "+psize;
document.getElementById("p1").innerHTML = "Thank you : " + inputField1;
document.getElementById("p2").innerHTML = "We have your address as: " + inputField2;
document.getElementById("p3").innerHTML = "Your phone number is: " + inputField3;
document.getElementById("p5").innerHTML = "Your total is " + result + "$"
document.getElementById("orders").innerHTML = "You ordered <br /> Pizzas: " + PIZ + " Drinks:" + DRK + " Desert Plates: " + DSRT;
document.getElementById("pizza_toppings").innerHTML = "Pizza Toppings: " + (toppings ? toppings : "None");
document.getElementById("spec_requests").innerHTML = "Special Requests: "+ document.getElementById("spec_req").value;
if (result >= 25) {
document.getElementById("p6").innerHTML =
"Congratulations, you have earned a free medium pizza with your next order and the code for it is Q1358"
}
else {
document.getElementById("p6").style.display = "none";
}
document.getElementById("p4").innerHTML = formatDate(new Date());
}
function formatDate(date) {
var day = date.getDate();
var month = date.getMonth()+1;
var year = date.getFullYear();
var hours = date.getHours() > 12 ? date.getHours() - 12 : date.getHours();
var am_pm = date.getHours() >= 12 ? "PM" : "AM";
hours = hours < 10 ? "0" + hours : hours;
hours = hours == 0 ? "12" : hours;
var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
time = hours + ":" + minutes + ":" + seconds + " " + am_pm;
return day + '/' + month + '/' + year + ' at ' + time;
}
</script>
<link rel="stylesheet" type="text/css" href="styleforgolden.css">
<div class="header">
<header>
<img src="GoldPizza.jpg">
<h1>Chicago Mediterranean Pizza </h1>
</header>
<h3>An American Pizza with a Middle Eastern taste!</h3>
</div>
<div class="main">
<h4>Start Your Order!</h4>
<form>
<p>Name:
<input type="text" id="txtName">
</p>
<p>Address:
<input type="text" id="txtAdd">
</p>
<p>Phone:
<input type="text" id="txtPh">
<p>Email:
<input type="text" id="Emailph">
</p>
</form>
Would you like to be added to our e-mailing list for specials offers?
<br/> Yes:
<div id="rad">
<input type="radio" id="r1" value="yes" name="radTerms" checked />
<br/> No:
<input type="radio" id="r2" value="no" name="radTerms" />
<br/>
</div>
<form>
<p>Choses Your Pizza Size:"</p>
<p>
<select id="PIZ">
<option value="10">Small ($10)</option>
<option value="13">Medium ($13)</option>
<option value="16">Large ($16)</option>
<option value="20">Extra Large($20)</option>
</select>
</p>
<p>Do You Want Drinks? </p>
<p>
<select id="DRK">
<option value="0">( 0 )</option>
<option value="1">(1 Drink for $1)</option>
<option value="2">(2 Drinks for $2)</option>
<option value="3">(3 Drinks for $3)</option>
<option value="4">(4 Drinks for $4)</option>
</select>
</p>
<p>Do You Want any Deserts Plates? </p>
<p>
<select id="DSRT">
<option value=0>( 0 )</option>
<option value=3>(1 Plate for $3)</option>
<option value=6>(2 Plates for $6)</option>
<option value=9>(3 Plates for $9)</option>
<option value=12>(4 Plates for $12)</option>
</select>
</p>
</form>
<form name="PizzaToppings">
<p>Pick Your Toppings: 50 cents each</p>
<p>Mushrooms:
<input type="checkbox" name="checkgroup" value=0.50>
</p>
<p>Sausage:
<input type="checkbox" name="checkgroup" value=0.50>
</p>
<p>Olives:
<input type="checkbox" name="checkgroup" value=0.50>
</p>
</form>
<form>
<p>Special requests?
<textarea name="" col="25" rows="5" id="spec_req"></textarea>
</p>
</form>
<form>
<input class="button button1" type="button" value="Submit My Order">
<p id="p1"></p>
<p id="p2"></p>
<p id="p3"></p>
<p id="p5"></p>
<p id="orders"></p>
<p id="pizza_toppings"></p>
<p id="spec_requests"></p>
<p id="p6"></p>
<p id="p7"></p>
<p id="p8"></p>
<p id="p4"></p>
</form>
</div>
<div class="footer" face="arial">
<i><h6>Chicago Mediterranean Pizza </h6></i>
<i><h6>3859 W Ogden Ave, Chicago, IL 60623 </h6></i>
<i><h6>708-307-2243 </h6></i>
</div>
</body>
</html>