window.alert not working. Please help!

Question

astnrocker 0 Newbie Poster

13 Years Ago

I am trying to get the total of the checkboxes selected when the user clicks the "calculate total" button. It isn't working though. What am I doing wrong?

<html>
<head>
<script type="text/javascript">
function calculate(f)
{
var nums = f.num;
var ntext = f.numtext;
var nitem = f.numitem;
var result = 0;
var items = '';
for(var i=0;i<nums.length;i++)
{
if(nums[i].checked)
{
result+=parseFloat(ntext[i].value);
items+=nitem[i].value+'\n';
}
}
f.answer.value=result;
}
if (nums[i].checked) {
window.alert("Your total is " + f.answer.value=result;);

}
</script>

</head>
<body>
<style type="text/css">
.box1 { float:left; 
		width:500px;
		clear:left;
		}
.box2 { float:left;
padding-left:50px;
}
</style>
<form name="myform">
Build your own family meal<br>
<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="24.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="pencil" onchange="calculate(this.form)">
<div class="box2">Chicken Enchiladas $24.00</div>
</div><br>

<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="15.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="pen" onchange="calculate(this.form)">
<div class="box2">Rice and Beans $15.00</div>
</div><br>

<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="6.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="paper" onchange="calculate(this.form)">
<div class="box2">Chips and Salsa $6.00</div>
</div><br>
<div class="box1">
<input type="submit" name="answer" value="Calculate Total" onclick="calculate(f)" />

</div>
</form>
</body>
</html>

javascript

2 Contributors
6 Replies
110 Views
1 Day Discussion Span
Latest Post 13 Years Ago Latest Post by astnrocker

stbuchok

13 Years Ago

What is the value being returned by nums.checked?

Also you can leave it as alert();, you don't need to do window.alert();

Also line 21, i does not exist, it existed inside the function, but this is outside the function.

stbuchok

13 Years Ago

Well i is going to be undefined at line 21 which means that nums.checked is going to be undefined. So you need to fix that. Also saying the value should be something doesn't help, what is the actual value at the point in time?

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

astnrocker 0 Newbie Poster · Answer 1 · 2011-07-19T01:27:09+00:00

What is the value being returned by nums.checked?
Also you can leave it as alert();, you don't need to do window.alert();
Also line 21, i does not exist, it existed inside the function, but this is outside the function.

The value should be whatever checkbox is selected. Either the 24, 15, or 6 dollars.

For the sake of the assignment I have to leave it as window.alert().

Line 21 is where I was trying to create the window alert. I know it's probably in the wrong spot and other stuff in the function should probably be deleted.

astnrocker 0 Newbie Poster · Answer 2 · 2011-07-19T02:05:23+00:00

This is what I was originally working with. In this one the total price and the selected items are displayed on the bottom. What I want to do is change this to instead have a pop up window simply stating the total cost when a submit button is pushed.

The code I had previously posted was this one but altered. I obviously don't really know what to change in the code to make it do what I'm wanting.

Do you think you can help me get the second window?

<html>
<head>
<script type="text/javascript">
function calculate(f)
{
var nums = f.num;
var ntext = f.numtext;
var nitem = f.numitem;
var result = 0;
var items = '';
for(var i=0;i<nums.length;i++)
{
if(nums[i].checked)
{
result+=parseFloat(ntext[i].value);
items+=nitem[i].value+'\n';
}
}
f.answer.value=result;

f.allitems.value=items;
}
</script>

</head>
<body>
<form name="myform">
Build your own family meal<br>
<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="24.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="Chicken Enchiladas" onchange="calculate(this.form)">
<div class="box2">Chicken Enchiladas $24.00</div>
</div>
<br>
<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="15.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="Rice and Beans" onchange="calculate(this.form)">
<div class="box2">Rice and Beans $15.00</div>
</div><br>
<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="6.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="Chips and Salsa" onchange="calculate(this.form)">
<div class="box2">Chips and Salsa $6.00</div>
</div><br>
<div class="box1">
Total <input type="text" name="answer" size="5"><textarea name="allitems" rows="5"></textarea>
</div>
</form>
</body>
</html>

stbuchok · Answer 3 · 2011-07-19T17:41:15+00:00

I'm sorry, but if this is an assignment, you should probably learn JavaScript by reading the book.

astnrocker 0 Newbie Poster · Answer 4 · 2011-07-19T21:55:10+00:00

Thanks for trying to help. I did read the book. Sometimes assignments would include things that weren't specifically covered in the book. I did find the solution though!

<html>

<head>

<script type="text/javascript">

var total = 0;

function calculate(f) {

	var nums = f.num;

	var ntext = f.numtext;

	var nitem = f.numitem;

	var result = 0;

	var items = '';

	

	for(var i=0;i<nums.length;i++) {

		if(nums[i].checked)

		{

			result+=parseFloat(ntext[i].value);

			items+=nitem[i].value+'\n';

		}

	}

	

	total = result



}

</script>



</head>

<body>

<form name="myform">

Build your own family meal<br>

<div class="box1">

<input type="checkbox" name="num" onClick="calculate(this.form)">

<input type="hidden" name="numtext" value="24.00" onChange="calculate(this.form)">

<input type="hidden" name="numitem" value="Chicken Enchiladas" onChange="calculate(this.form)">

<div class="box2">Chicken Enchiladas $24.00</div>

</div>

<br>

<div class="box1">

<input type="checkbox" name="num" onClick="calculate(this.form)">

<input type="hidden" name="numtext" value="15.00" onChange="calculate(this.form)">

<input type="hidden" name="numitem" value="Rice and Beans" onChange="calculate(this.form)">

<div class="box2">Rice and Beans $15.00</div>

</div><br>

<div class="box1">

<input type="checkbox" name="num" onClick="calculate(this.form)">

<input type="hidden" name="numtext" value="6.00" onChange="calculate(this.form)">

<input type="hidden" name="numitem" value="Chips and Salsa" onChange="calculate(this.form)">

<div class="box2">Chips and Salsa $6.00</div>

</div><br>

<div class="box1">

Total <button type="button" onClick="alert('Your total is $' + total);">Show Total</button>

</div>

</form>

</body>

</html>