Sum of a column (in a Table)

Collapse
X
Collapse
 
  • Page of 3
  • Time
  • Show
Clear All
new posts
Previous 1 2 3 template Next
  • Stevee
    New Member
    • Sep 2007
    • 30
    #1

    Sum of a column (in a Table)

    I have a table running with combo boxes, basically selecting an item in the combo box (located in a <td>) will insert the selection and a price in the following <td>
    but currently I am having problems creating the a total of the prices, is there any help out there?
    Tags: None
    • ronverdonk
      Recognized Expert Specialist
      • Jul 2006
      • 4259
      #2
      You can use JavaScript to do the calculations for the Total column.

      Ronald

        Comment

        • Stevee
          New Member
          • Sep 2007
          • 30
          #3
          Originally posted by ronverdonk
          You can use JavaScript to do the calculations for the Total column.

          Ronald
          I seem to be having problems with that as well, how would that be done?

            Comment

            • drhowarddrfine
              Recognized Expert Expert
              • Sep 2006
              • 7434
              #4
              html/css cannot do this. I'll transfer you to the javascript forum.

                Comment

                • gits
                  Recognized Expert Moderator Expert
                  • May 2007
                  • 5390
                  #5
                  hi ...

                  please post the code you already have ... so that we may help you with the particular problems you might have ...

                  kind regards

                    Comment

                    • acoder
                      Recognized Expert MVP
                      • Nov 2006
                      • 16032
                      #6
                      Post what code you have so far.

                        Comment

                        • Stevee
                          New Member
                          • Sep 2007
                          • 30
                          #7
                          The script thus far, I shall be adding a little more but am stuck on this "Total" part:

                          Code:
                          <html>
<head><title>???</title>

<script type="text/javascript">
function getinfo()
{
var mylist=document.getElementById("info")
document.getElementById("displayinfo").innerHTML=mylist.options[mylist.selectedIndex].price
}

function getinfo1()
{
var mylist=document.getElementById("info1")
document.getElementById("displayinfo1").innerHTML=mylist.options[mylist.selectedIndex].price
}

function getinfo2()
{
var mylist=document.getElementById("info2")
document.getElementById("displayinfo2").innerHTML=mylist.options[mylist.selectedIndex].price
}
</script> 

</head>
<body>
<table border="1">
<tr>
<td width="95" align="right">
<select id="info" onchange="getinfo()">
<option selected price=" ">Select</option>
<option price="19.00">Unit 1</option>
<option price="22.00">Unit 2</option>
<option price="25.00">Unit 3</option>
<option price="29.00">Unit 4</option>
<option price="32.00">Unit 5</option>
</select>
</td>
<td width="75" align="right" id="displayinfo"> </td>
</tr>

<tr>
<td width="95" align="right">
<select id="info1" onchange="getinfo1()">
<option selected price=" ">Select</option>
<option price="84.00">Next 1</option>
<option price="85.00">Next 2</option>
<option price="86.00">Next 3</option>
<option price="87.00">Next 4</option>
<option price="88.00">Next 5</option>
</select>
</td>
<td width="75" align="right" id="displayinfo1"> </td>
</tr>

<tr>
<td width="95" align="right">
<select id="info2" onchange="getinfo2()">
<option selected price=" ">Select</option>
<option price="99.00">Again 1</option>
<option price="92.00">Again 2</option>
<option price="95.00">Again 3</option>
<option price="99.00">Again 4</option>
<option price="92.00">Again 5</option>
</select>
</td>
<td width="75" align="right" id="displayinfo2"> </td>
</tr>

<tr>
<td width="95" align="right">Total = </td>
<td width="75" align="right"> </td>
</tr>
</table>

</body>
</html>
                          Last edited by gits; Sep 14 '07, 12:34 PM. Reason: added code tags

                            Comment

                            • gits
                              Recognized Expert Moderator Expert
                              • May 2007
                              • 5390
                              #8
                              hi ...

                              a simple way would be to use a global array and push the value to add everytime you select a value in your select-boxes. then loop through the array and add the values ... finally set the value to the display-node ...

                              if you need help on that ... post back with particular questions ...

                              kind regards

                                Comment

                                • Stevee
                                  New Member
                                  • Sep 2007
                                  • 30
                                  #9
                                  Originally posted by gits
                                  hi ...

                                  please post the code you already have ... so that we may help you with the particular problems you might have ...

                                  kind regards
                                  The script thus far, I shall be adding a little more but am stuck on this "Total" part:
                                  Code:
                                  <html>
<head><title>???</title>

<script type="text/javascript">
function getinfo()
{
var mylist=document.getElementById("info")
document.getElementById("displayinfo").innerHTML=mylist.options[mylist.selectedIndex].price
}

function getinfo1()
{
var mylist=document.getElementById("info1")
document.getElementById("displayinfo1").innerHTML=mylist.options[mylist.selectedIndex].price
}

function getinfo2()
{
var mylist=document.getElementById("info2")
document.getElementById("displayinfo2").innerHTML=mylist.options[mylist.selectedIndex].price
}
</script>

</head>
<body>
<table border="1">
<tr>
<td width="95" align="right">
<select id="info" onchange="getinfo()">
<option selected price=" ">Select</option>
<option price="19.00">Unit 1</option>
<option price="22.00">Unit 2</option>
<option price="25.00">Unit 3</option>
<option price="29.00">Unit 4</option>
<option price="32.00">Unit 5</option>
</select>
</td>
<td width="75" align="right" id="displayinfo"> </td>
</tr>

<tr>
<td width="95" align="right">
<select id="info1" onchange="getinfo1()">
<option selected price=" ">Select</option>
<option price="84.00">Next 1</option>
<option price="85.00">Next 2</option>
<option price="86.00">Next 3</option>
<option price="87.00">Next 4</option>
<option price="88.00">Next 5</option>
</select>
</td>
<td width="75" align="right" id="displayinfo1"> </td>
</tr>

<tr>
<td width="95" align="right">
<select id="info2" onchange="getinfo2()">
<option selected price=" ">Select</option>
<option price="99.00">Again 1</option>
<option price="92.00">Again 2</option>
<option price="95.00">Again 3</option>
<option price="99.00">Again 4</option>
<option price="92.00">Again 5</option>
</select>
</td>
<td width="75" align="right" id="displayinfo2"> </td>
</tr>

<tr>
<td width="95" align="right">Total = </td>
<td width="75" align="right"> </td>
</tr>
</table>

</body>
                                  Last edited by acoder; Sep 14 '07, 01:42 PM. Reason: Added code tags

                                    Comment

                                    • Stevee
                                      New Member
                                      • Sep 2007
                                      • 30
                                      #10
                                      Originally posted by gits
                                      hi ...

                                      a simple way would be to use a global array and push the value to add everytime you select a value in your select-boxes. then loop through the array and add the values ... finally set the value to the display-node ...

                                      if you need help on that ... post back with particular questions ...

                                      kind regards
                                      Hi, I'm not particularly well practiced with javascript therefore a "global array" and "display-node" doesn't mean a great deal I'm afraid.

                                        Comment

                                        • acoder
                                          Recognized Expert MVP
                                          • Nov 2006
                                          • 16032
                                          #11
                                          Stevee, remember to use code tags when posting code, e.g.
                                          &#91;CODE=javas cript]Javascript code goes here[/CODE]

                                            Comment

                                            • Stevee
                                              New Member
                                              • Sep 2007
                                              • 30
                                              #12
                                              Originally posted by acoder
                                              Stevee, remember to use code tags when posting code, e.g.
                                              [CODE=javascript]Javascript code goes here[/CODE]
                                              Stoopid me ok - Why?

                                                Comment

                                                • acoder
                                                  Recognized Expert MVP
                                                  • Nov 2006
                                                  • 16032
                                                  #13
                                                  Instead of "price", use the normal attribute "value", e.g.
                                                  [HTML]<option value="99.00">[/HTML]
                                                  In each function, update the total too (by summing the three selects).

                                                  Give the td which will contain the total value an id. This will make it easier to access it.

                                                    Comment

                                                    • acoder
                                                      Recognized Expert MVP
                                                      • Nov 2006
                                                      • 16032
                                                      #14
                                                      Originally posted by Stevee
                                                      Stoopid me ok - Why?
                                                      Makes it a lot easier to read, plus you get syntax highlighting as a bonus.

                                                        Comment

                                                        • Stevee
                                                          New Member
                                                          • Sep 2007
                                                          • 30
                                                          #15
                                                          Originally posted by acoder
                                                          Instead of "price", use the normal attribute "value", e.g.
                                                          [HTML]<option value="99.00">[/HTML]
                                                          In each function, update the total too (by summing the three selects).

                                                          Give the td which will contain the total value an id. This will make it easier to access it.
                                                          Right, I will give that a go and let you know if I managed on Monday.

                                                          Thanks.

                                                            Comment

                                                            Previous 1 2 3 template Next
                                                            Working...