Announcement

**shlagish** · Feb 29, 2004, 08:17 PM

Here's one way of doing it.

Code:

<html>
<head>
<script type="text/javascript">
<!--

function check()
{
nums=document.forms[0].num;
answer=document.forms[0].answer;
result=0;
for(i=0;i<nums.length;i++)
{
if(nums[i].checked)
{
result=result+parseInt(nums[i].value);
}
}
answer.value=result;
}

-->
</script>

</head>
<body>

<form>
Which numbers do you want to add?<br>
<input type="checkbox" name="num" value="1">1<br>

<input type="checkbox" name="num" value="2">2<br>

<input type="checkbox" name="num" value="3">3<br>

<input type="text" name="answer" size="30">
<input type="button" name="test" onclick="check()" value="Order">
</form>

</body>
</html>

**glenngv** · Mar 1, 2004, 04:30 AM

Other way

I think Nitro2 wants it to automatically calculate as the user is clicking the checkbox or even editing the textbox.

Code:

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

  //if you want to fix to 2 decimal places
  //f.answer.value=Number(result).toFixed(2);
}
</script>
</head>
<body>
<form name="myform">
Which numbers do you want to add?<br />
<input type="checkbox" name="num" onclick="calculate(this.form)" /><input type="text" name="numtext" value="1.50" onchange="calculate(this.form)" /><br />
<input type="checkbox" name="num" onclick="calculate(this.form)" /><input type="text" name="numtext" value="2.00" onchange="calculate(this.form)" /><br />
<input type="checkbox" name="num" onclick="calculate(this.form)" /><input type="text" name="numtext" value="3.20" onchange="calculate(this.form)" /><br />
Total <input type="text" name="answer" size="5" readonly="readonly" />
</form>
</body>
</html>

**Nitro2** · Mar 1, 2004, 10:01 AM

glenngv, thank you - that's exactly what i wanted

shlagish, appreciate your effort too

**glenngv** · Mar 1, 2004, 08:53 PM

Nitro2 wrote on 03-01-2004 11:36 PM:
Hi, sorry to bother you, but i was wondering if you could help me a bit more.

Is it possible to have another box where the "values" of the checkboxes get added? Like for example the first values checkbox could be "pencil" the second "pen" - and when selected, they'd do the calculation part and also add the values to the new textbox - kind of like this:

Thanks

Yes.

Code:

<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 you want to fix to 2 decimal places
  //f.answer.value=Number(result).toFixed(2);

  f.allitems.value=items;
}
</script>
</head>
<body>
<form name="myform">
Which numbers do you want to add?<br>
<input type="checkbox" name="num" onclick="calculate(this.form)"><input type="text" name="numtext" value="1.50" onchange="calculate(this.form)"><input type="text" name="numitem" value="pencil" onchange="calculate(this.form)"><br>
<input type="checkbox" name="num" onclick="calculate(this.form)"><input type="text" name="numtext" value="2.00" onchange="calculate(this.form)"><input type="text" name="numitem" value="pen" onchange="calculate(this.form)"><br>
<input type="checkbox" name="num" onclick="calculate(this.form)"><input type="text" name="numtext" value="3.20" onchange="calculate(this.form)"><input type="text" name="numitem" value="paper" onchange="calculate(this.form)"><br>
Total <input type="text" name="answer" size="5"><textarea name="allitems" rows="5"></textarea>
</form>
</body>
</html>

**shlagish** · Mar 1, 2004, 11:13 PM

Is this a shopping cart?

**leemarquis** · Jun 3, 2008, 11:12 AM

Is it possible to assign values to checkboxes but have a different label for them. So in this example would it be possible to replace the numbers with the names of the items but still have the numbers associated with each checkbox so that the calculations still work, but the user doesnt see the individual values?

**abduraooft** · Jun 3, 2008, 11:26 AM

Create a new thread to ask your question rather than activating a very old one!

Announcement

Selecting items to add up using checkboxes

Selecting items to add up using checkboxes

Comment

Comment

Comment

Comment

Comment

Comment

Comment