[CODE]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--< html xmlns="http://www.w3.org/1999/xhtml"> -->
<h1>
Pizzeria</h1>
<p>
</p>
<p>
<b>Name:</b>
<input id="txtName" type="text" />
<b>Pickup:</b>
<input id="rdbPickUp" name="DeliveryMethod" type="radio" value="PickUp" /> <b>Delivery:</b>
<input id="rdbDelivery" name="DeliveryMethod" type="radio" value="Delivery" /></p>
<p>
<!-- create ddl for style and size-->
<!-- make ddl have a set value-->
<b>Style:</b>
<select id="ddlStyle">
<option selected="selected">Choose Style</option>
<option value="empty"></option>
<option value="deepDish">Deep Dish</option>
<option value="TomatoPie">Tomato Pie</option>
<option value="ThinCrust">Thin Crust</option>
<option value="Stuffed Crust">Stuffed Crust</option>
</select>
<b>Size:</b>
<select id="ddlSize">
<option selected="selected">Choose Size</option>
<option value="empty"></option>
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<option value="XLarge">Xtra Large</option>
<!-- <option value="other">Other value</option>-->
</select></p>
<p>
<!-- Toppings:
<select id="investment1" <optgroup="" label="" name="investment0">
<option value="1000">$1,000</option>
<option value="5000">$5,000</option>
<option value="10000">$10,000</option>
<option value="25000">$25,000</option>
<option value="other">Other value</option>
</select></p>-->
<p>
<b>Toppings: </b> <b> Pepperoni: </b>
<input id="chkPepperoni" type="checkbox" /><b> Black Olives: </b>
<input id="chkBlkOlives" type="checkbox" />
<b>Meatballs: </b>
<input id="chkMeatball" type="checkbox" /><b> Sausage: </b>
<input id="chkSausage" type="checkbox" /></p>
<p>
</p>
<p>
<input id="btnConfirmOrder" type="button" value="Confirm Order" /> &nb sp;
<input id="btnClrFrm" type="button" value="Clear Form" onclick="this.form.reset()" /></p>
<!-- //does this work? -->
<p>
<textarea id="txtArea" rows='10' cols='40' disabled='disabled'></textarea></p>
<p>
</p>
<script language="javascript" type="text/javascript">
var $ = function (id) {
return document.getElementById(id);
}
function () {
//get buttons and assign a funtion to its onclick
$("btnConfirmOrder").onclick = ConfirmOrder;
$("btnClrFrm").onclick = ClrFrm;
}
function ConfirmOrder() {
//alert
var message = "You have ordered the following:\n\n";
//test the toppings checkboxes
//display the checked toppings in textbox
if ($("chkPepperoni").checked) {
message +=
" - " + $("chkPepperoni").value + "\n";
}
else if ($("chkBlkOlives").checked) {
message +=
" - " + $("chkBlkOlives").value + "\n";
}
else if ($("chkMeatball").checked) {
message +=
" - " + $("chkMeatball").value + "\n";
}
else if ($("chkSausage").checked) {
message +=
" - " + $("chkSausage").value + "\n";
}
//confirm to user what they have accepted
//confirm(message)
$("txtArea").value = message;
}
}
</script>
<!--</body>-->
</html>
[CODE]
I am trying to get every thing entered into a text box at the bottom with a confirmation alert, also for the clear button to work. I cant figure out why it's not working!!!!
Before you post, read our: 
