Posting Shark,
You can ignore my last post. I was able to get rid of the brackets all together and return the following from the server.
var teams = {
"LA Lakers":
{
"Team Logo":"C:\\wamp\\wwwNBA\\laLakersLogo.gif",
"0":
{
"Players":
{
"36":
{
"PlayerName":"Ron Artest",
"Position":"Forward",
"Height":"6-7 l",
"Weight":"260","College":
"St. Johns"
},
"24":
{
"PlayerName":"Kobe Bryant",
"Position":"Guard","Height":
"6-6 l","Weight":"205",
"College":"Lower Marion High Sc"
}
}
}
}
};
The only thing with this is that var tLen = teams.length is undefined. Do you know why? Can I still use the parsing js code that you provided me or will things change a little?Hi,
it will be alot more easier if you will grouped them as a team, instead of defining another object for the path of images just to display each logo.
In this approch i've used the document.writeln method, and created a table to differentiate each of the item inside the teamsobject variable.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>W3C HTML 4.01 loose DTD</title>
<style type="text/css">
<!--
td {
border-right : 1px solid #A0A0A0;
border-top : 1px solid #A0A0A0;
background-color : #F1F1F1;
color : #405060; }
th:first-child {
border-bottom : 1px solid #A0A0A0;
border-right : 1px solid #A0A0A0;
background-color : #800090;
color : yellow;
width : 25%;
}
table {
border : 1px solid #A0A0A0;
border-collapse : collapse;
text-align : left;
width : 100%; }
// -->
</style>
<script type="text/javascript">
<!--
var teams = [
{ "LA Lakers" : {
"Team Logo" : "C:\\wamp\\wwwNBA\\laLakersLogo.gif",
Players : {
37 : { // Jersey n#
PlayerName : "Ron Artest",
Position : "Forward",
Height : "6-7",
Weight : "260",
College : "St. Johns"
},
24 : {
PlayerName : "Kobe Bryant",
Position : "Guard",
Height : "6-6",
Weight : "205",
College : "Lower Marion High Sc"
}
}
}
}
// Add More NBA teams below >>>
];
// -->
</script>
</head>
<body>
<noscript>
<p> This site requires a browser that support <b>JavaScript</b>. </p>
</noscript>
<div id="nbastats">
<script type="text/javascript">
<!--
( function() {
var tLen = teams.length;
var table = '<table id="tableOne" border="0" cellpadding="5" cellspacing="0" frame="void" rules="none" summary="NBA Statistic Table">\n';
for ( var x = 0; x < tLen; x++ ) {
table += "<tr>\n";
for ( var teamName in teams[ x ] ) {
table += "<th title=\"" + teamName + "\" colspan=\"3\">Team Name: </th>\n";
table += "<td colspan=\"3\">" + teamName + "</td>\n";
table += "</tr>\n";
table += "<tr>\n";
for ( var misc in teams[ x ][ teamName ] ) {
table += "<th colspan=\"3\">" + misc + "</th>\n";
} table += "</tr>\n";
table += "<tr>\n";
var count = 10;
var image = new Image();
image.src = teams[ x ][ teamName ][ "Team Logo" ];
table += "<td style=\"background-color : #FFFFFF;\" rowspan=\"" + ( count += ( 1 * 10 )) + "\" colspan=\"3\"><img src=\"" + image.src + "\" alt=\"" + image.src + "\"></td>";
table += "</tr>\n";
for ( var j in teams[ x ][ teamName ][ misc ] ) {
for ( var player in teams[ x ][ teamName ][ misc ][ j ] ) {
table += "<tr>\n";
table += "<td style=\"text-align : center; background-color : #E0E0E0\">" + player + "</td><td>" + teams[ x ][ teamName ][ misc ][ j ][ player ] + "</td>\n";
table += "</tr>\n";
}
table += "<tr>\n";
table += "<td>Jersey no.</td><td>#" + j + "</td>\n";
table += "</tr>\n";
table += "<tr>\n";
table += "<td colspan=\"2\" style=\"background-color : #800090; height : 5px;\"> </td>\n";
table += "</tr>\n";
}
}
} table += "</table>";
document.writeln( table );
} )( /* NBA Teams & Players */ )
// -->
</script>
</div>
</body>
</html>
you can easily expand all procedures inside this function. Just be careful when you edit the lines'.
