www.webdeveloper.com
+ Reply to Thread
Results 1 to 13 of 13
  1. 04-26-2006 06:14 PM #1
    powerpack80
    powerpack80 is offline Registered User
    Join Date
    Apr 2006
    Posts
    15

    Trouble with calculating value in tables

    Hello,

    I have a small sports league i'm doing in my home town. On the "Standings" page, i want to display the records of all the teams, and have a column which will calculate the winning percentage. here is the code i have for the table...

    <center><font color="#3366FF" size="+8"><u>WEST</u></font></center>
    <center><table style="color:#0000FF" border="2" bordercolorlight="#990000" bordercolordark="#333333" bgcolor="#CCCCCC">
    <tr><th colspan="100%" align="left"><font size="+3" color="#990000">Northern California</font></th></tr>
    <tr>
    <td width="20" align="center"></td>
    <td width="300">Team</td>
    <td width="30" align="center">W</td>
    <td width="30" align="center">L</td>
    <td width="50" align="center">Pct.</td>
    <td width="50" align="center">Streak</td>
    </tr>
    <tr>
    <td align="center">1</td>
    <td>786</td>
    <td align="center">11</td>
    <td align="center">1</td>
    <td align="center">.917</td>
    <td align="center">7W</td>
    </tr>
    <tr>
    <td align="center">2</td>
    <td>Kings Of Cali</td>
    <td align="center">10</td>
    <td align="center">2</td>
    <td align="center">.833</td>
    <td align="center">5W</td>
    </tr>
    <tr>
    <td align="center">3</td>
    <td>Bombs Away</td>
    <td align="center">9</td>
    <td align="center">3</td>
    <td align="center">.750</td>
    <td align="center">1W</td>
    </tr>
    <tr>
    <td align="center">4</td>
    <td>Rehab</td>
    <td align="center">6</td>
    <td align="center">6</td>
    <td align="center">.500</td>
    <td align="center">5W</td>
    </tr>
    <tr>
    <td align="center">5</td>
    <td>Team Alameda</td>
    <td align="center">5</td>
    <td align="center">7</td>
    <td align="center">.416</td>
    <td align="center">1L</td>
    </tr>
    <tr>
    <td align="center">6</td>
    <td>Da Bay</td>
    <td align="center">4</td>
    <td align="center">8</td>
    <td align="center">.333</td>
    <td align="center">1L</td>
    </tr>
    <tr>
    <td align="center">7</td>
    <td>Strokers</td>
    <td align="center">2</td>
    <td align="center">10</td>
    <td align="center">.166</td>
    <td align="center">3L</td>
    </tr>
    <tr>
    <td align="center">8</td>
    <td>Cal State Crew</td>
    <td align="center">1</td>
    <td align="center">11</td>
    <td align="center">.083</td>
    <td align="center">11L</td>
    </tr>

    </table></center>

    I know it looks pretty redundant. I dont know much about web developing. Thats why i signed up for this site. Is it possible to have the "pct" column automatically calculate the winning percentage of each team? I'd rather not do it all by hand.
    Any help would be appreciated.
    Thank you
    Powerpack80
    Reply With Quote Reply With Quote
  2. 04-26-2006 09:23 PM #2
    hyperlisk's Avatar
    hyperlisk
    hyperlisk is offline Some guy...
    Join Date
    Mar 2006
    Location
    California
    Posts
    306
    I didn't test these, but they should work...

    Put this in your <head> section:
    Code:
    <script language="JavaScript">
function addTeam(name,wins,losses,streak){
  if(typeof teams=="undefined") teams = new Array();
  percent = getPercent(wins,(wins+losses));
  teams[teams.length] = [(teams.length+1),name,wins,losses,percent,streak);
}
function getPercent(wins,total){
  p = wins/total;
  p *= 1000;
  p = parseInt(p);
  p /= 1000;
  return p;
}

//////  ADD TEAMS ///////
// addTeam("NAME", WINS, LOSSES, "STREAK");
addTeam("786",11,1,"7W");
</script>
    And put this in your body, where you want the table to show up:
    Code:
    <script language="JavaScript">
document.write("<table style="color:#0000FF" border="2" bordercolorlight="#990000" bordercolordark="#333333" bgcolor="#CCCCCC">");
document.write("<tr><th colspan="100%" align="left"><font size="+3" color="#990000">Northern California</font></th></tr>");
document.write("<tr><td width="20" align="center"></td><td width="300">Team</td><td width="30" align="center">W</td><td width="30" align="center">L</td><td width="50" align="center">Pct.</td><td width="50" align="center">Streak</td></tr>");
for(i=0;i<teams.length;i++){
  document.write("<tr>");
  for(j=0:j<teams[i].length;j++){
    document.write("<td>"+teams[i][j]+"</td>");
  }
  document.write("</tr>");
}
</script>
    JS > PHP > Everything
    Reply With Quote Reply With Quote
  3. 04-27-2006 10:18 AM #3
    powerpack80
    powerpack80 is offline Registered User
    Join Date
    Apr 2006
    Posts
    15
    tried doing that, but nothing is coming up. I did not see a </table> tag. Did it work for you?
    Last edited by powerpack80; 04-27-2006 at 10:32 AM.
    Reply With Quote Reply With Quote
  4. 04-27-2006 11:24 AM #4
    hyperlisk's Avatar
    hyperlisk
    hyperlisk is offline Some guy...
    Join Date
    Mar 2006
    Location
    California
    Posts
    306
    Opps, mismatched Quotes. Well, I am trying to fix it because it still isn't working. I am in school right now though...
    JS > PHP > Everything
    Reply With Quote Reply With Quote
  5. 04-27-2006 11:37 AM #5
    powerpack80
    powerpack80 is offline Registered User
    Join Date
    Apr 2006
    Posts
    15
    I'll be the first to admit, i know nothing about Javascript. But, i'm trying to slowly learn. I just made this up based on a few searches ive done...let me know what kind of errors i'll have...

    THIS GOES BETWEEN "HEAD" TAGS:

    <script type="text/javascript">
    <!--
    function Percentage()
    {
    return Math.divide(W/(W+L));
    }
    //-->


    This will go into the BODY tags, but more specifically inside the "TD" tag in the table. for each corresponding row...

    <script type="text/javascript">
    <!--
    var W =
    var L =
    document.write(Percentage());
    //-->
    </script>

    But somehow i gotta figure out how to set "var W =" to the value i put in the table. and the same for "var L =".
    But then again, i could be COMPLETELY off, and u could be laughing ur head off at me right now. lololol. Thank you for your help either way.
    Powerpack80
    Reply With Quote Reply With Quote
  6. 04-27-2006 11:46 AM #6
    James Gatka
    James Gatka is offline Banned
    Join Date
    Jan 2006
    Location
    I'm in GMT -5
    Posts
    561
    Try this instead. It's been tested in IE and FF. Copy it AS IS, then save it as an .html document.

    Code:
    <html>
<head>
<script type="text/javascript">

	function init(){

		var startRow = 2;
		if (navigator.appName != "Microsoft Internet Explorer"){startRow--}
		var nTable = document.getElementsByTagName('table')[0];
		var nRow = nTable.rows.length;
		var nCell = nTable.rows[nRow-1].cells.length;
		for (i=startRow; i<nRow; i++)
			{
			 nTable.rows[i].cells[4].lastChild.data = (((Number(nTable.rows[i].cells[2].lastChild.data) / (Number(nTable.rows[i].cells[2].lastChild.data) + Number(nTable.rows[i].cells[3].lastChild.data))).toFixed(3))*100).toFixed(1);
			}
	}

	onload=init;

</script>
</head>
<body>

<center><font color="#3366FF" size="+8"><u>WEST</u></font></center>

<table align="center" style="color:#0000FF" border="2" bordercolorlight="#990000" bordercolordark="#333333" bgcolor="#CCCCCC" cellspacing="0" cellpadding="5">
<thead>
<th colspan="6"><font size="+3" color="#990000">Northern California</font></th>
</thead>
<tbody>
<tr>
<td wdth="20" align="middle">&nbsp</td>
<td width="300" align="middle">Team</td>
<td width="30" align="middle">W</td>
<td width="30" align="middle">L</td>
<td width="50" align="middle">Pct.</td>
<td width="50" align="middle">Streak</td>
</tr>
<tr>
<td align="middle">1</td>
<td>786</td>
<td align="middle">11</td>
<td align="middle">1</td>
<td align="middle">&nbsp</td>
<td align="middle">7W</td>
</tr>
<tr>
<td align="middle">2</td>
<td>Kings Of Cali</td>
<td align="middle">10</td>
<td align="middle">2</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">3</td>
<td>Bombs Alostay</td>
<td align="middle">9</td>
<td align="middle">3</td>
<td align="middle">&nbsp</td>
<td align="middle">1W</td>
</tr>
<tr>
<td align="middle">4</td>
<td>Rehab</td>
<td align="middle">6</td>
<td align="middle">6</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">5</td>
<td>Team Alameda</td>
<td align="middle">5</td>
<td align="middle">7</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">6</td>
<td>Da Bay</td>
<td align="middle">4</td>
<td align="middle">8</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">7</td>
<td>Strokers</td>
<td align="middle">2</td>
<td align="middle">10</td>
<td align="middle">&nbsp</td>
<td align="middle">3L</td>
</tr>
<tr>
<td align="middle">8</td>
<td>Cal State Crelost</td>
<td align="middle">1</td>
<td align="middle">11</td>
<td align="middle">&nbsp</td>
<td align="middle">11L</td>
</tr>
</tbody>
</table>

</body>
</html>
    Reply With Quote Reply With Quote
  7. 04-27-2006 12:44 PM #7
    powerpack80
    powerpack80 is offline Registered User
    Join Date
    Apr 2006
    Posts
    15
    that worked just about perfectly.u definitely helped me out. thank you very much.
    Reply With Quote Reply With Quote
  8. 04-27-2006 12:52 PM #8
    James Gatka
    James Gatka is offline Banned
    Join Date
    Jan 2006
    Location
    I'm in GMT -5
    Posts
    561
    powerpack80:

    You're welcome. My NAME is James, please address me by it.
    Reply With Quote Reply With Quote
  9. 04-27-2006 03:16 PM #9
    powerpack80
    powerpack80 is offline Registered User
    Join Date
    Apr 2006
    Posts
    15
    James,
    Thank you again for that help. Now, i'm trying to understand the code you wrote...how can i make it work for 2 or more tables on the same page? I tried to repeat the table, but the pct. did not work on the 2nd table. I have 4 divisions, so i need to put 4 tables.
    Reply With Quote Reply With Quote
  10. 04-27-2006 03:35 PM #10
    James Gatka
    James Gatka is offline Banned
    Join Date
    Jan 2006
    Location
    I'm in GMT -5
    Posts
    561
    powerpack:

    I realized too late, that what you are trying to do is use the baseball type of statistic. Meaning, they are "batting 1000", and that equals, 1.000. Otherwise, the team's "record" should display as: .685, etc.

    The .Pct at the top of the column confused me. It's not a percentage if it's expressed as a decimal only. But, I'm splittin hairs.

    So, here's the revised code. I'll post the second revision to use it with multiple tables soon.

    And just to help you and others, don't piecemeal a problem. If you have multiple tables, then state that at the start.

    Code:
    <html>
<head>
<script type="text/javascript">

	function init(){

		var startRow = 2;
		var tmp = 0;
		if (navigator.appName != "Microsoft Internet Explorer"){startRow--}
		var nTable = document.getElementsByTagName('table')[0];
		var nRow = nTable.rows.length;
		for (i=startRow; i<nRow; i++)
			{
			 tmp = ((Number(nTable.rows[i].cells[2].lastChild.data) / (Number(nTable.rows[i].cells[2].lastChild.data) + Number(nTable.rows[i].cells[3].lastChild.data))).toFixed(3))
			 if (tmp < 1)
				{
			 	 tmp  = tmp.split(".");
				 nTable.rows[i].cells[4].lastChild.data = "."+tmp[1];
				}
			 if (tmp == 1)
				{
				 nTable.rows[i].cells[4].lastChild.data = "1.000";
				}
			}
	}

	onload=init;

</script>
</head>
<body>

<center><font color="#3366FF" size="+8"><u>WEST</u></font></center>

<table align="center" style="color:#0000FF" border="2" bordercolorlight="#990000" bordercolordark="#333333" bgcolor="#CCCCCC" cellspacing="0" cellpadding="5">
<thead>
<th colspan="6"><font size="+3" color="#990000">Northern California</font></th>
</thead>
<tbody>
<tr>
<td wdth="20" align="middle">&nbsp</td>
<td width="300" align="middle">Team</td>
<td width="30" align="middle">W</td>
<td width="30" align="middle">L</td>
<td width="50" align="middle">Record</td>
<td width="50" align="middle">Streak</td>
</tr>
<tr>
<td align="middle">1</td>
<td>786</td>
<td align="middle">12</td>
<td align="middle">0</td>
<td align="middle">&nbsp</td>
<td align="middle">7W</td>
</tr>
<tr>
<td align="middle">2</td>
<td>Kings Of Cali</td>
<td align="middle">10</td>
<td align="middle">2</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">3</td>
<td>Bombs Alostay</td>
<td align="middle">9</td>
<td align="middle">3</td>
<td align="middle">&nbsp</td>
<td align="middle">1W</td>
</tr>
<tr>
<td align="middle">4</td>
<td>Rehab</td>
<td align="middle">6</td>
<td align="middle">6</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">5</td>
<td>Team Alameda</td>
<td align="middle">5</td>
<td align="middle">7</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">6</td>
<td>Da Bay</td>
<td align="middle">4</td>
<td align="middle">8</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">7</td>
<td>Strokers</td>
<td align="middle">2</td>
<td align="middle">10</td>
<td align="middle">&nbsp</td>
<td align="middle">3L</td>
</tr>
<tr>
<td align="middle">8</td>
<td>Cal State Crelost</td>
<td align="middle">1</td>
<td align="middle">11</td>
<td align="middle">&nbsp</td>
<td align="middle">11L</td>
</tr>
</tbody>
</table>

</body>
</html>
    Reply With Quote Reply With Quote
  11. 04-27-2006 03:44 PM #11
    James Gatka
    James Gatka is offline Banned
    Join Date
    Jan 2006
    Location
    I'm in GMT -5
    Posts
    561
    powerpack:

    Here's the code for as many tables as are on the page. Again, copy it AS IS, then save it as an .html document.

    Code:
    <html>
<head>
<script type="text/javascript">

	function init(){

		var startRow = 2;
		var tmp = 0;
		if (navigator.appName != "Microsoft Internet Explorer"){startRow--}
		var nTable = document.getElementsByTagName('table');
		
		for (n=0; n<nTable.length; n++)
			{
			 var nRow = nTable[n].rows.length;
			 for (i=startRow; i<nRow; i++)
				{
			 	tmp = ((Number(nTable[n].rows[i].cells[2].lastChild.data) / (Number(nTable[n].rows[i].cells[2].lastChild.data) + Number(nTable[n].rows[i].cells[3].lastChild.data))).toFixed(3))
			 	if (tmp < 1)
					{
			 	 	 tmp  = tmp.split(".");
				 	 nTable[n].rows[i].cells[4].lastChild.data = "."+tmp[1];
					 }
				if (tmp == 1)
					{
				 	 nTable[n].rows[i].cells[4].lastChild.data = "1.000";
					}
				}
			}
	}

	onload=init;

</script>
</head>
<body>

<center><font color="#3366FF" size="+8"><u>WEST</u></font></center>

<table align="center" style="color:#0000FF" border="2" bordercolorlight="#990000" bordercolordark="#333333" bgcolor="#CCCCCC" cellspacing="0" cellpadding="5">
<thead>
<th colspan="6"><font size="+3" color="#990000">Northern California</font></th>
</thead>
<tbody>
<tr>
<td wdth="20" align="middle">&nbsp</td>
<td width="300" align="middle">Team</td>
<td width="30" align="middle">W</td>
<td width="30" align="middle">L</td>
<td width="50" align="middle">Record</td>
<td width="50" align="middle">Streak</td>
</tr>
<tr>
<td align="middle">1</td>
<td>786</td>
<td align="middle">12</td>
<td align="middle">0</td>
<td align="middle">&nbsp</td>
<td align="middle">7W</td>
</tr>
<tr>
<td align="middle">2</td>
<td>Kings Of Cali</td>
<td align="middle">10</td>
<td align="middle">2</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">3</td>
<td>Bombs Alostay</td>
<td align="middle">9</td>
<td align="middle">3</td>
<td align="middle">&nbsp</td>
<td align="middle">1W</td>
</tr>
<tr>
<td align="middle">4</td>
<td>Rehab</td>
<td align="middle">6</td>
<td align="middle">6</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">5</td>
<td>Team Alameda</td>
<td align="middle">5</td>
<td align="middle">7</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">6</td>
<td>Da Bay</td>
<td align="middle">4</td>
<td align="middle">8</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">7</td>
<td>Strokers</td>
<td align="middle">2</td>
<td align="middle">10</td>
<td align="middle">&nbsp</td>
<td align="middle">3L</td>
</tr>
<tr>
<td align="middle">8</td>
<td>Cal State Crelost</td>
<td align="middle">1</td>
<td align="middle">11</td>
<td align="middle">&nbsp</td>
<td align="middle">11L</td>
</tr>
</tbody>
</table>

<br><br>

<table align="center" style="color:#0000FF" border="2" bordercolorlight="#990000" bordercolordark="#333333" bgcolor="#CCCCCC" cellspacing="0" cellpadding="5">
<thead>
<th colspan="6"><font size="+3" color="#990000">Northern California</font></th>
</thead>
<tbody>
<tr>
<td wdth="20" align="middle">&nbsp</td>
<td width="300" align="middle">Team</td>
<td width="30" align="middle">W</td>
<td width="30" align="middle">L</td>
<td width="50" align="middle">Record</td>
<td width="50" align="middle">Streak</td>
</tr>
<tr>
<td align="middle">1</td>
<td>786</td>
<td align="middle">12</td>
<td align="middle">0</td>
<td align="middle">&nbsp</td>
<td align="middle">7W</td>
</tr>
<tr>
<td align="middle">2</td>
<td>Kings Of Cali</td>
<td align="middle">10</td>
<td align="middle">2</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">3</td>
<td>Bombs Alostay</td>
<td align="middle">9</td>
<td align="middle">3</td>
<td align="middle">&nbsp</td>
<td align="middle">1W</td>
</tr>
<tr>
<td align="middle">4</td>
<td>Rehab</td>
<td align="middle">6</td>
<td align="middle">6</td>
<td align="middle">&nbsp</td>
<td align="middle">5W</td>
</tr>
<tr>
<td align="middle">5</td>
<td>Team Alameda</td>
<td align="middle">5</td>
<td align="middle">7</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">6</td>
<td>Da Bay</td>
<td align="middle">4</td>
<td align="middle">8</td>
<td align="middle">&nbsp</td>
<td align="middle">1L</td>
</tr>
<tr>
<td align="middle">7</td>
<td>Strokers</td>
<td align="middle">2</td>
<td align="middle">10</td>
<td align="middle">&nbsp</td>
<td align="middle">3L</td>
</tr>
<tr>
<td align="middle">8</td>
<td>Cal State Crelost</td>
<td align="middle">1</td>
<td align="middle">11</td>
<td align="middle">&nbsp</td>
<td align="middle">11L</td>
</tr>
</tbody>
</table>

</body>
</html>
    Reply With Quote Reply With Quote
  12. 04-27-2006 04:20 PM #12
    powerpack80
    powerpack80 is offline Registered User
    Join Date
    Apr 2006
    Posts
    15
    James,

    Thank you again for your help. This works perfectly. I was trying to study the code you gave me, and see if i could figure it out myself. I almost had it...The line you added

    for (n=0; n<nTable.length; n++)

    instead, i had originally put n<nTable instead of n<nTable.length

    thank you again
    Noor
    Reply With Quote Reply With Quote
  13. 04-27-2006 04:22 PM #13
    James Gatka
    James Gatka is offline Banned
    Join Date
    Jan 2006
    Location
    I'm in GMT -5
    Posts
    561
    You're welcome, Noor. Take care. Good luck with the managing all that data.
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

     

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts

Forum Rules

 HTML5 Development Center



Recent Articles