Why cant I get my output into the text box and to have a confirmation alert?

deed

10-03-2012, 07:38 AM

[CODE]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<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>


<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>

</select></p>
<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" />                   
<input id="btnClrFrm" type="button" value="Clear Form" onclick="this.form.reset()" /></p>

<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>

</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!!!!

shyagrawal

10-03-2012, 07:57 AM

Please add onclick event on input type of Confirmed Order. Your input statement should look like <input id="btnConfirmOrder" type="button" value="Confirm Order" onclick="ConfirmOrder();"/>. You also need to remove one extra closing parenthesis from the function ConfirmOrder() to remove javascript error. I am also placing the updated code. You are not getting oder name because you have not added "value" parameter in the <input id="chkPepperoni" type="checkbox" /><b> Black Olives: </b>.

deed

10-03-2012, 09:32 AM

Thanks for your help, but it didn't work :(

shyagrawal

10-03-2012, 09:43 AM

Please use below code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<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>


<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>

</select></p>
<p>

<p>
<b>Toppings: </b>  <input id="chkPepperoni" type="checkbox" value="Pepperoni"/><b> Pepperoni: </b>
<input id="chkBlkOlives" type="checkbox" value="Black Olives"/><b> Black Olives: </b>
<input id="chkMeatball" type="checkbox" value="Meatballs"/><b>Meatballs: </b>
<input id="chkSausage" type="checkbox" value="Sausage"/><b> Sausage: </b>

<p>
 </p>
<p>
 <input id="btnConfirmOrder" type="button" value="Confirm Order" onclick="ConfirmOrder();"/>                &nb sp;  
<input id="btnClrFrm" type="button" value="Clear Form" onclick="this.form.reset()" /></p>

<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";
}
if ($("chkBlkOlives").checked) {
message +=" - " + $("chkBlkOlives").value + "\n";
}
if ($("chkMeatball").checked) {
message +=" - " + $("chkMeatball").value + "\n";
}
if ($("chkSausage").checked) {
message +=" - " + $("chkSausage").value + "\n";
}

//confirm to user what they have accepted
//confirm(message)

$("txtArea").value = message;

}

</script>

</html>

deed

10-03-2012, 10:32 AM

I'm just going to abandon this whole route. My hw is so simple yet it's taking me hours and hours to figure out. ugh