Quote (carteblanche @ Nov 12 2015 10:25pm)

still have problems...



what is that first quote doing right there after toppings? you should be seeing errors in the console. you dont need me to point this out

Quote (Zom8 @ Nov 12 2015 10:27pm)

I understand that. I guess what I was asking , is my method of showing the toppings in the paragraph correct? If so, All i need to do is go through and fix coding errors. And I don't use an editor because they dont allow us -.- . Probably will pick one up to validate, then copy over to notepad.

Quote

And I don't use an editor because they dont allow us -.- .

Quote (carteblanche @ Nov 12 2015 10:31pm)

more or less

this might help.
http://jshint.com/
http://jsfiddle.net/

notepad is terrible. notepad++ is way better.

Quote

function totalcost(){
var type;
var newline= "";
var sum=0.00;
var toppings;

if( document.getElementById("small").checked==true){
type="Small Pizza";
sum+=10.00;
}
if( document.getElementById("medium").checked==true){
type="Medium Pizza";
sum+=12.00;
}
if( document.getElementById("large").checked==true){
type="Large Pizza";
sum+=16.00;
}
if( document.getElementById("pepperoni").checked==true){
toppings="Pepperoni, ";
sum+=1.00;
}
if( document.getElementById("olives").checked==true){
toppings="Olives, ";
sum+=0.50;
}
if( document.getElementById("sausage").checked==true){
toppings="Sausage, ";
sum+=1.00;
}
if( document.getElementById("peppers").checked==true){
toppings="Peppers, ";
sum+=0.50;
}
if( document.getElementById("onions").checked==true){
toppings="Onions, ";
sum+=0.50;
}

var length = toppings.length;{
toppings = toppings.slice(0,length-2);}

document.getElementById("opta").innerHTML = type+newline+toppings+newline+toppings+newline+"Price - $"+sum.toFixed(2);
}

Quote (Zom8 @ Nov 12 2015 10:41pm)

that site was nice, but it's still not chaning the "opta" id to the desired outcome. I hit calculate and it displays nothing.

Quote (carteblanche @ Nov 12 2015 11:06pm)

you're essentially saying "my program isn't working" which isn't very descriptive. you need to narrow down your problem.
1) is it calling your totalcost function?
2) is it getting far enough into your function to execute the innerHTML call?
3) is it finding your control by the id?
4) is it setting the innerHTML attribute?

you can use debugging tools, logging, or simple alert statements. if any of those answers is no, then you have your problem. if the answers are all yes, look into alternatives.

Quote (Zom8 @ Nov 12 2015 11:22pm)

To be more descriptive

http://i67.tinypic.com/2lasf28.png

is my desired outcome. If I run this as a text area and call upon my innerhtml function it posts the material I want. But when used with a <p> tag is does not. Which is what I need

Code

Quote (carteblanche @ Nov 12 2015 11:26pm)

i get that. i posted 4 questions. answer them. if you answer yes to them all, provide the values for these variables:
type
newline
toppings
sum

and i dont mean "run this in your mind and tell me the values". i mean run your program and tell me these values. you can use a debugging tool, logging, alert statements, or whatever else you prefer.

my point is that you're thinking the innerHTML is not working. however, i dont think that's the case. i think it's a problem before it ever gets to that line, but you haven't tested your code so you don't know what the problem is.

just glancing at it, i can already tell you this will fail under a scenario, so it will never even try to print your stuff

Quote (carteblanche @ Nov 12 2015 11:26pm)

i get that. i posted 4 questions. answer them. if you answer yes to them all, provide the values for these variables:
type
newline
toppings
sum

and i dont mean "run this in your mind and tell me the values". i mean run your program and tell me these values. you can use a debugging tool, logging, alert statements, or whatever else you prefer.

my point is that you're thinking the innerHTML is not working. however, i dont think that's the case. i think it's a problem before it ever gets to that line, but you haven't tested your code so you don't know what the problem is.

just glancing at it, i can already tell you this will fail under a scenario, so it will never even try to print your stuff

Quote

OCTYPE html>
<html lang="en">
<!--
ITEC225 Assignment 5
This HTML document is an
order form for a fictional
New York Style Pizza Restaurant, template file -->

<head><title>Vinny's New York Style Pizza</title>
<meta charset="utf-8" />


<style type="text/css">

body {margin-left:50px;
margin-right:50px;
font-size:16pt;
font-weight:bold;
}
h3 {border-style:solid;}

th,td {font-weight:bold;
font-size:14pt;
padding:0.50em;
border-style:solid;border-color:red;border-width:0.2em;
background-color:#E0E0E0;
}
caption {font-weight:bold;padding:0.5em;border-style:solid;
border-color:red;border-width:0.2em;background-color:lightblue;}
#outp {background-color:#FFFF66;width:20em;}
table {border-collapse:collapse;border-style:solid;border-color:red;border-width:0.2em;}
</style>

<script type="text/javascript">

function calculate(){
var type="";

var sum=0.00;
var toppings="";
var toppings2="";
var name = document.getElementById("fn").value;
name = name;

if( document.getElementById("small").checked==true){
type="Small Pizza"
sum=10.00;
}
if( document.getElementById("med").checked==true){
type="Medium Pizza";
sum=12.00;
}
if( document.getElementById("large").checked==true){
type="Large Pizza";
sum=16.00;
}
if( document.getElementById("marinara").checked==true){
toppings="Marinara";
}
if( document.getElementById("meat").checked==true){
toppings="Tomato with meat";
}
if( document.getElementById("white").checked==true){
toppings="White";
}
if( document.getElementById("pepperoni").checked==true){
toppings2=toppings2+"Pepperoni, ";
sum+=1.00;
}
if( document.getElementById("onions").checked==true){
toppings2=toppings2+"Onions, ";
sum+=0.50;
}
if( document.getElementById("sausage").checked==true){
toppings2=toppings2+"Sausage, ";
sum+=1.00;
}
if( document.getElementById("peppers").checked==true){
toppings2=toppings2+"Green Peppers, ";
sum+=0.50;
}
if( document.getElementById("olives").checked==true){
toppings2=toppings2+"Olives, ";
sum+=0.50;
}
if( document.getElementById("extraCheese").checked==true){
toppings2=toppings2+"Extra Cheese, ";
sum+=1.00;
}
var length = toppings2.length;
toppings2 = toppings2.slice(0,length-2);
document.getElementById("outar").innerHTML = type+"<br />"+toppings+"<br />"+"Toppings: "+toppings2+"<br />"+"Price - $"+sum.toFixed(2)+"<br />"+"Thank you "+name+"!";
}
function erase(){
document.getElementById("outar").innerHTML = "";
}

</script>
<body>
<form action="" method="post" >
<table>
<caption>Vinny's New York Style Pizza <br />
On-line Order Form </caption>
<tr>
<td colspan="3">First Name: &nbsp;
<input type="text" maxlength="10" name="fn" id="fn" />
(all alphabetics max length 10)
</td>
<th rowspan="10" id="outp"><h3>Order Details</h3><p id="outar"></p></th>
</tr>
<tr>
<td colspan="3">Phone #: &nbsp;
<input type="text" maxlength="8" name="ph" id="ph" />
&nbsp;&nbsp;Format: ddd-dddd
</td>
</tr>
<tr>
<th colspan="3">
SIZE: Select the size pizza you want:<br />
</th>
</tr>
<tr>
<td><input type="radio" name="size" id="small" value="10" checked="checked"/>Small - $10.00</td>
<td><input type="radio" name="size" id="med" value="12" />Medium - $12.00</td>
<td><input type="radio" name="size" id="large" value="16" />Large - $16.00</td>
</tr>
<tr>
<th colspan="3">
SAUCE: Select the sauce for your pizza:<br />
</th>
</tr>
<tr>
<td><input type="radio" name="sauce" id="marinara" value="marinara" checked="checked"/>Marinara </td>
<td><input type="radio" name="sauce" id="meat" value="meat" />Tomato with Meat</td>
<td><input type="radio" name="sauce" id="white" value="white" />White</td>
</tr>
<tr>
<th colspan="3">
TOPPINGS: Select the toppings for your pizza
</th>
</tr>
<tr>
<td>
<input type="checkbox" id="pepperoni" value="pepperoni" />Pepperoni ($1.00)
</td>
<td>
<input type="checkbox" id="onions" value="onions" />Onions ($0.50)
</td>
<td>
<input type="checkbox" id="sausage" value="sausage" />Sausage ($1.00)
</td>
</tr>
<tr>
<td>
<input type="checkbox" id="peppers" value="greenPeppers" />Green Peppers ($0.50)
</td>
<td>
<input type="checkbox" id="olives" value="olives" />Olives ($0.50)
</td>
<td>
<input type="checkbox" id="extraCheese" value="extraCheese" />Extra Cheese ($1.00)
</td>
</tr>
<tr>
<th colspan="3">
<input type="button" onclick="calculate()" value = "Calculate Order Price"/>
<input type="reset" onclick="erase()" value="Clear Form" />
</th>
</tr>
</table>

</form>
</body>