We help IT Professionals succeed at work.

We've partnered with Certified Experts, Carl Webster and Richard Faulkner, to bring you two Citrix podcasts. Learn about 2020 trends and get answers to your biggest Citrix questions!Listen Now

x

javascript for calculating total for a column

dennis231
dennis231 asked
on
Medium Priority
648 Views
Last Modified: 2012-05-06
In my HTML document, I have a table contains following fields:

StudentID|ExamScore1|ExamScore2
00001|90|100
00002|70|100
00003|60|80

How do I write a javascript to calculate the total for ExamScore1 and ExamScore2 columns? So my table will look like this:
00001|90|100
00002|70|100
00003|60|80
Total|220|280

Thanks for your help.



Comment
Watch Question

You mean HTML table? If so then is the number of rows going to remain the same?

Author

Commented:
Yes, it is a html table, but the number of rows will be changed from time to time.

Sample table:
<table border="1" width="822">
    <tr>
        <td width="266">StudentID</td>
        <td width="266">
            <p><span class="value">ExamScore1</span></p>
        </td>
        <td width="266">
            <p><span class="value">ExamScore2</span></p>
        </td>
    </tr>
    <tr>
        <td width="266">
            <p><span class="value">00001</span></p>
        </td>
        <td width="266">90</td>
        <td width="266">100</td>
    </tr>
    <tr>
        <td width="266">
            <p><span class="value">00002</span></p>
        </td>
        <td width="266">70</td>
        <td width="266">100</td>
    </tr>
    <tr>
        <td width="266">
            <p><span class="value">00003</span></p>
        </td>
        <td width="266">60</td>
        <td width="266">80</td>
    </tr>
    <tr>
        <td width="266" bgcolor="aqua">Total</td>
        <td width="266" bgcolor="aqua"><b>220 &nbsp;<-calculate total</b></td>
        <td width="266" bgcolor="aqua">
            <p><b>280 <-calculate total</b></p>
        </td>
    </tr>
</table>
I can do it for you tomorrow if you can wait. Time for me to sleep now..
CERTIFIED EXPERT
Expert of the Year 2008
Top Expert 2008
Commented:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
function init()
{
	calculateTotal()
}
window.onload=init;
function calculateTotal(){
	var t=document.getElementById("myTable");
	var totals=[0,0,0];
 
	for( var row=1, limit=t.rows.length-1; row < limit; ++row)
	{
		for( var col=1,cellLimit=t.rows[row].cells.length; col < cellLimit; ++col)
		{
			totals[col] += parseInt(t.rows[row].cells[col].innerHTML);
		} 
	}
	t.rows[t.rows.length-1].cells[1].innerHTML=totals[1];
	t.rows[t.rows.length-1].cells[2].innerHTML=totals[2];
}
</script> 
</head>
<body>
<table id="myTable" border="1" width="822">
    <tr>
        <td width="266">StudentID</td>
        <td width="266">
            <p><span class="value">ExamScore1</span></p>
        </td>
        <td width="266">
            <p><span class="value">ExamScore2</span></p>
        </td>
    </tr>
    <tr>
        <td width="266">
            <p><span class="value">00001</span></p>
        </td>
        <td width="266">90</td>
        <td width="266">100</td>
    </tr>
    <tr>
        <td width="266">
            <p><span class="value">00002</span></p>
        </td>
        <td width="266">70</td>
        <td width="266">100</td>
    </tr>
    <tr>
        <td width="266">
            <p><span class="value">00003</span></p>
        </td>
        <td width="266">60</td>
        <td width="266">80</td>
    </tr>
    <tr>
        <td width="266" bgcolor="aqua">Total</td>
        <td width="266" bgcolor="aqua"><b>220 &nbsp;<-calculate total</b></td>
        <td width="266" bgcolor="aqua">
            <p><b>280 <-calculate total</b></p>
        </td>
    </tr>
</table>
</body>
</html>

Open in new window

Not the solution you were looking for? Getting a personalized solution is easy.

Ask the Experts
Access more of Experts Exchange with a free account
Thanks for using Experts Exchange.

Create a free account to continue.

Limited access with a free account allows you to:

  • View three pieces of content (articles, solutions, posts, and videos)
  • Ask the experts questions (counted toward content limit)
  • Customize your dashboard and profile

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.