Start Free TrialLog in
Avatar of Tom Powers
Tom Powers

asked on 

Show data from xml file in two seperate tables one table for one team and one table for 2nd team

I'm trying to display 6 players from a xml file 3 players for the first and 3 players for the second table. the first table is one team 3 players that are the team leaders in Passing, Rushing and Receiving. The Logos and First and Last name donot show correctly on the two tables http://199.233.14.112/aspdata/nfl2/Leaderslocal.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Sports Network</title>
<style type="text/css">
.IMAGEALIGN {
	text-align: center;
	vertical-align: middle;
}
.imagealign2 {
	text-align: center;
	vertical-align: top;
}
.tbcolor {
	background-image: url(http://199.233.14.112/aspdata/nfl2/Greywall.png);
}
.tophigh {
	text-align: center;
	vertical-align: top;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var xmlPath = '.'; // '/xml/nfl/scores/real';
  var xmlGameID = 'AB-3171'; // game id only, _counter.xml will be added in the ajax call
  var counterXml = 42;
 // var counterXml = 0;

  // TODO: check these, especially the first one!
  var arrIDs = {
    "Rushing_Stats": {
      id: "Rusher" || "Rusher2",
      start: "Rush",
      attrs: {
      "ATT": "Attempts",
      "YDS": "Yards",
      "AVG": "Average",
      "TD": "Touchdowns"
      }
    },
    "Passing_Stats": {
      id: "Passer" || "Passer2" ,
      start: "Pass",
      attrs: {
        "ATT": "Attempts",
        "COMP": "Completions",
        "YDS": "Yards",
        "TD": "Touchdowns",
        "INT": "Interceptions"
      }
    },
    "Pass_Receiving_Stats": {
      id: "Receiver" || "Receiver2",
      start: "Receiving",
      attrs: {
        "REC": "Receptions",
        "YDS": "Yards",
        "AVG": "Average",
        "TD": "Touchdowns"
      }
    }
  };

  var sPlayerImagePath = 'http://images.sportsnetwork.com/nfl/atthegridiron/players/';
  var sBlankImage = 'Blank.png'; // check extension, include path if needed

 function loadData()
{
  $.ajax(
  {
    type: "GET",
    url: xmlPath + "/" + xmlGameID + '_' + counterXml + ".xml",
    dataType: "xml",
    success: function (data)
    {
      var d = $(data);
      var Play = d.find('Play');
	  var Team = d.find('Team');
      var TeamOffID = $(Play).attr('OffID');
      var CurrentLeaders = d.find('CurrentLeaders');
      var Passing = $(CurrentLeaders).find('Passing[TeamID="' + TeamOffID + '"]');
      var Rushing = $(CurrentLeaders).find('Rushing[TeamID="' + TeamOffID + '"]');
      var Receiving = $(CurrentLeaders).find('Receiving[TeamID="' + TeamOffID + '"]');
      var PlayerID = Passing.attr('PlayerID');
      var PlayerID1 = Rushing.attr('PlayerID');
      var PlayerID2 = Receiving.attr('PlayerID');
	 if ($(Team).attr('OffID') == TeamOffID) {
		   $('#teamlogo1').attr('src', 'http://199.233.14.112/aspdata/nfl2/' + $(Team).attr('ID') + ".png");
                                $('#teamlogo2').attr('src', 'http://199.233.14.112/aspdata/nfl2/' + $(Team).attr('ID') + ".png");
                                $('#teamlogo3').attr('src', 'http://199.233.14.112/aspdata/nfl2/' + $(Team).attr('ID') + ".png");
	  }
	  
	  
      $('#imgRush').attr('src', (PlayerID1 > 0 ? sPlayerImagePath + PlayerID1 + ".jpg" : sBlankImage));
      $('#imgPass').attr('src', (PlayerID  > 0 ? sPlayerImagePath + PlayerID  + ".jpg" : sBlankImage));
      $('#imgWR')  .attr('src', (PlayerID2 > 0 ? sPlayerImagePath + PlayerID2 + ".jpg" : sBlankImage));
      var Individual_Statistics = d.find('Individual_Statistics[IS_TeamID="' + TeamOffID + '"]');
      $(Individual_Statistics).children().each(function(i, AllStats){
        if (arrIDs[AllStats.nodeName])
        {
          var idselector = arrIDs[AllStats.nodeName].id;
          var nodeStart = arrIDs[AllStats.nodeName].start; // AllStats.nodeName.substr(0, AllStats.nodeName.length - 5); // need the part before Stats
          var PlayerIDforThisListing = (nodeStart == "Rush" ? PlayerID1 : (nodeStart == "Receiving" ? PlayerID2 : PlayerID));
          $(AllStats).find(nodeStart + '_Listing').each(function(i2, Pass_Listing){
            if ($(Pass_Listing).find(nodeStart + '_PlayerID').text() == PlayerIDforThisListing)
            {
              var Firstname = $(Pass_Listing).find(nodeStart + '_Firstname').text();
              var Lastname = $(Pass_Listing).find(nodeStart + '_Lastname').text();
              $('#'+idselector).html(Firstname + ' ' + Lastname);
              switch (nodeStart)
              {
                case "Rush":
                  $("#lratt") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["ATT"] ).text() );
                  $("#lryds") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["YDS"] ).text() );
                  $("#lravg") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["AVG"] ).text() );
                  $("#gTDS")  .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["TD"]  ).text() );
                  break;
 
                case "Pass":
                  $("#lpatt") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["ATT"] ).text() );
                  $("#lpComp").html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["COMP"]).text() );
                  $("#lpYDS") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["YDS"] ).text() );
                  $("#lpTD")  .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["TD"]  ).text() );
                  $("#LPINT") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["INT"] ).text() );
                  break;
 
                case "Receiving":
                  $("#lrrec") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["REC"] ).text() );
                  $("#lrryds").html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["YDS"] ).text() );
                  $("#lrrAVG").html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["AVG"] ).text() );
                  $("#lrrtd") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["TD"]  ).text() );
                  break;
              }
            }
          }); // each xxx_Listing
        }
      }); // each xxx_Stats
     // ++counterXml;
    }
  }); //ajax
}
 function loadDataDef()
{
  $.ajax(
  {
    type: "GET",
    url: xmlPath + "/" + xmlGameID + '_' + counterXml + ".xml",
    dataType: "xml",
    success: function (data)
    {
      var d = $(data);
      var Play = d.find('Play');
	  var Team = d.find('Team');
      var TeamDefID = $(Play).attr('DefID');
      var CurrentLeaders = d.find('CurrentLeaders');
      var Passing = $(CurrentLeaders).find('Passing[TeamID="' + TeamDefID + '"]');
      var Rushing = $(CurrentLeaders).find('Rushing[TeamID="' + TeamDefID + '"]');
      var Receiving = $(CurrentLeaders).find('Receiving[TeamID="' + TeamDefID + '"]');
      var PlayerID3 = Passing.attr('PlayerID');
      var PlayerID4 = Rushing.attr('PlayerID');
      var PlayerID5 = Receiving.attr('PlayerID');
	 
		 
		  
			 
	  if ($(Team).attr('DefID') == TeamDefID) {
		   $('#teamlogo4').attr('src', 'http://199.233.14.112/aspdata/nfl2/' + $(Team).attr('ID') + ".png");
                                $('#teamlogo5').attr('src', 'http://199.233.14.112/aspdata/nfl2/' + $(Team).attr('ID') + ".png");
                                $('#teamlogo6').attr('src', 'http://199.233.14.112/aspdata/nfl2/' + $(Team).attr('ID') + ".png");
	  }
	  
      $('#imgRush2').attr('src', (PlayerID4 > 0 ? sPlayerImagePath + PlayerID4 + ".jpg" : sBlankImage));
      $('#imgPass2').attr('src', (PlayerID3  > 0 ? sPlayerImagePath + PlayerID3  + ".jpg" : sBlankImage));
      $('#imgWR2')  .attr('src', (PlayerID5 > 0 ? sPlayerImagePath + PlayerID5 + ".jpg" : sBlankImage));
      var Individual_Statistics = d.find('Individual_Statistics[IS_TeamID="' + TeamDefID + '"]');
      $(Individual_Statistics).children().each(function(i, AllStats){
        if (arrIDs[AllStats.nodeName])
        {
          var idselector = arrIDs[AllStats.nodeName].id;
          var nodeStart = arrIDs[AllStats.nodeName].start; // AllStats.nodeName.substr(0, AllStats.nodeName.length - 5); // need the part before Stats
          var PlayerIDforThisListing = (nodeStart == "Rush" ? PlayerID4 : (nodeStart == "Receiving" ? PlayerID5 : PlayerID3));
          $(AllStats).find(nodeStart + '_Listing').each(function(i2, Pass_Listing){
            if ($(Pass_Listing).find(nodeStart + '_PlayerID').text() == PlayerIDforThisListing)
            {
              var Firstname = $(Pass_Listing).find(nodeStart + '_Firstname').text();
              var Lastname = $(Pass_Listing).find(nodeStart + '_Lastname').text();
              $('#'+idselector).html(Firstname + ' ' + Lastname);
              switch (nodeStart)
              {
                case "Rush":
                  $("#lratt2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["ATT"] ).text() );
                  $("#lryds2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["YDS"] ).text() );
                  $("#lravg2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["AVG"] ).text() );
                  $("#gTDS2")  .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["TD"]  ).text() );
                  break;
 
                case "Pass":
                  $("#lpatt2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["ATT"] ).text() );
                  $("#lpComp2").html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["COMP"]).text() );
                  $("#lpYDS2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["YDS"] ).text() );
                  $("#lpTD2")  .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["TD"]  ).text() );
                  $("#LPINT2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["INT"] ).text() );
                  break;
 
                case "Receiving":
                  $("#lrrec2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["REC"] ).text() );
                  $("#lrryds2").html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["YDS"] ).text() );
                  $("#lrrAVG2").html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["AVG"] ).text() );
                  $("#lrrtd2") .html( $(Pass_Listing).find(nodeStart + '_' + arrIDs[AllStats.nodeName].attrs["TD"]  ).text() );
                  break;
              }
			
		  
            }
          }); // each xxx_Listing
        }
      }); // each xxx_Stats
    // ++counterXml;
   
    }
     
	   
  }); //ajax
}
</script>

</head>

<body>
<table width="800" height="121" border="1" class="tbcolor">
  <tr>
    <td width="75" rowspan="4" class="tophigh"><p><img src="Blank1.gif" alt="" name="imgRush" width="53" height="68" id="imgRush"><span class="imagealign2"><img src="061.png" name="teamlogo1" width="43" height="36" id="teamlogo1"></span></p></td>
    <td colspan="4"><div align="center">Leading Rusher</div></td>
    <td width="77" rowspan="4" class="imagealign2"><img src="Blank1.gif" name="imgPass" width="53" height="68" id="imgPass"><span class="tophigh"><img src="061.png" alt="" name="teamlogo2" width="43" height="36" id="teamlogo2"></span></td>
    <td colspan="5"><div align="center">Leading Passer</div></td>
    <td width="83" rowspan="4" class="imagealign2"><img src="Blank1.gif" name="imgWR" width="53" height="68" id="imgWR"><span class="tophigh"><img src="061.png" alt="" name="teamlogo3" width="43" height="36" id="teamlogo3"></span></td>
    <td colspan="4"><div align="center">Leading Receiver</div></td>
  </tr>
  <tr>
    <td height="23" colspan="4" id="Rusher"><div align="center" id="Rusher">Rusher</div></td>
    <td colspan="5" id="Passer"><div align="center" id="Passer">Passer</div></td>
    <td colspan="4" id="Receiver"><div align="center" id="Receiver">Receiver</div></td>
  </tr>
  <tr>
    <td width="42" height="26"><div align="center">ATT</div></td>
    <td width="38"><div align="center">YDS</div></td>
    <td width="37"><div align="center">AVG </div></td>
    <td width="32"><div align="center">TD</div></td>
    <td width="39"><div align="center">ATT</div></td>
    <td width="46"><div align="center">COMP</div></td>
    <td width="35"><div align="center">YDS</div></td>
    <td width="38"><div align="center">TD</div></td>
    <td width="42"><div align="center">INT</div></td>
    <td width="37"><div align="center">REC</div></td>
    <td width="40"><div align="center">YDS</div></td>
    <td width="36"><div align="center">AVG</div></td>
    <td width="37"><div align="center">TD</div></td>
  </tr>
  <tr>
    <td height="23"><div align="center" class="imagealign2" id="lratt">lratt</div></td>
    <td><div align="center" class="imagealign2" id="lryds">lryds</div></td>
    <td><div align="center" class="imagealign2" id="lravg">lravg</div></td>
    <td><div align="center" class="imagealign2" id="gTDS">lgTDS</div></td>
    <td><div align="center" class="imagealign2" id="lpatt">lpatt</div></td>
    <td><div align="center" class="imagealign2" id="lpComp">lpComp</div></td>
    <td><div align="center" class="imagealign2" id="lpYDS">lpYDS</div></td>
    <td><div align="center" class="imagealign2" id="lpTD">lpTD</div></td>
    <td><div align="center" class="imagealign2" id="LPINT">LPINT</div></td>
    <td><div align="center" id="lrrec">lrrec</div></td>
    <td><div align="center" id="lrryds">lryds</div></td>
    <td><div align="center" id="lrrAVG">lrAVG</div></td>
    <td><div align="center" id="lrrtd">lrtd</div></td>
  </tr>
</table>
<table width="800" height="100" border="1" class="tbcolor">
  <tr>
    <td width="75" rowspan="4" class="tophigh"><img src="Blank1.gif" alt="Dude" name="imgRush2" width="53" height="68" id="imgRush2"><img src="061.png" alt="" name="teamlogo4" width="43" height="36" id="teamlogo4"></td>
    <td colspan="4"><div align="center">Leading Rusher</div></td>
    <td width="77" rowspan="4" class="imagealign2"><img src="Blank1.gif" alt="Dude" name="imgPass2" width="53" height="68" id="imgPass2"><span class="tophigh"><img src="061.png" alt="" name="teamlogo5" width="43" height="36" id="teamlogo5"></span></td>
    <td colspan="5"><div align="center">Leading Passer</div></td>
    <td width="83" rowspan="4" class="imagealign2"><img src="Blank1.gif" alt="Dude" name="imgWR2" width="53" height="68" id="imgWR2"><span class="tophigh"><img src="061.png" alt="" name="teamlogo6" width="43" height="36" id="teamlogo6"></span></td>
    <td colspan="4"><div align="center">Leading Receiver</div></td>
  </tr>
  <tr>
    <td height="23" colspan="4" id="Rusher2"><div align="center" id="Rusher2">Rusher</div></td>
    <td colspan="5" id="Passer2"><div align="center" id="Passer2">Passer</div></td>
    <td colspan="4" id="Receiver2"><div align="center" id="Receiver2">Receiver</div></td>
  </tr>
  <tr>
    <td width="42" height="26"><div align="center">ATT</div></td>
    <td width="38"><div align="center">YDS</div></td>
    <td width="37"><div align="center">AVG </div></td>
    <td width="32"><div align="center">TD</div></td>
    <td width="39"><div align="center">ATT</div></td>
    <td width="46"><div align="center">COMP</div></td>
    <td width="35"><div align="center">YDS</div></td>
    <td width="38"><div align="center">TD</div></td>
    <td width="42"><div align="center">INT</div></td>
    <td width="37"><div align="center">REC</div></td>
    <td width="40"><div align="center">YDS</div></td>
    <td width="36"><div align="center">AVG</div></td>
    <td width="37"><div align="center">TD</div></td>
  </tr>
  <tr>
    <td height="29"><div align="center" class="imagealign2" id="lratt2">lratt</div></td>
    <td><div align="center" class="imagealign2" id="lryds2">lryds</div></td>
    <td><div align="center" class="imagealign2" id="lravg2">lravg</div></td>
    <td><div align="center" class="imagealign2" id="gTDS2">lgTDS</div></td>
    <td><div align="center" class="imagealign2" id="lpatt2">lpatt</div></td>
    <td><div align="center" class="imagealign2" id="lpComp2">lpComp</div></td>
    <td><div align="center" class="imagealign2" id="lpYDS2">lpYDS</div></td>
    <td><div align="center" class="imagealign2" id="lpTD2">lpTD</div></td>
    <td><div align="center" class="imagealign2" id="LPINT2">LPINT</div></td>
    <td><div align="center" id="lrrec2">lrrec</div></td>
    <td><div align="center" id="lrryds2">lryds</div></td>
    <td><div align="center" id="lrrAVG2">lrAVG</div></td>
    <td><div align="center" id="lrrtd2">lrtd</div></td>
  </tr>
</table>
<p>&nbsp; </p>
<p>&nbsp; </p>
<script>
var myVar=setInterval(function(){myTimer()},1000);

function myTimer()
{

loadData();
loadDataDef();
}
  </script>
</body>
</html>

Open in new window

i WOULD LIKE one table Green BAY Players AND 2ND Table Eagles Players or the tables can switch cause I'm using xml attrib OffID AND DefID. OffID represents team on Offense
and DefID represents team on Defense.As Long as each table is the one team and correct info and logo from the other table.Team Logos need to switch and First and Lastnames that's really it.User generated image Here is code

Thanks EE I'll hardcode game id in Html to make it easier I have to put these files in a zip cause If I don't I get the xml file gets changed from_ to a dash.
Stuff.zip
JavaScriptjQueryXML
Avatar of undefined
Last Comment
Tom Powers
ASKER CERTIFIED SOLUTION
Avatar of Robert Schutt
Robert Schutt
Flag of Netherlands image
Blurred text
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
Avatar of Robert Schutt
Robert Schutt
Flag of Netherlands image
One thing I just saw in your code on line 33:
id: "Rusher" || "Rusher2",

Open in new window

I don't think that will work the way you may expect it to, something like try the second node if the first doesn't exist? That will have to be coded in the loop, because now it's just a string and the second part will be ignored. The || used like that will only use the second part if the first part is null/undefined (or 0, false, empty string maybe) if I'm not mistaken.
Avatar of Tom Powers
Tom Powers

ASKER

Again this guy makes it happen in javascript AND Jquery using PFM.
Rob is like Chip Kelly. I didn't think Rob's code would work in this case but flawless again PFM.
Thanks Rob
JavaScript
JavaScript

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and in almost every mainstream web browser.

127K
Questions
--
Followers
--
Top Experts
Get a personalized solution from industry experts
Ask the experts

  • "Invaluable tool for our organization"

    Josh Regalski

  • "Your help has saved me hundreds of hours of internet surfing."

    @fblack61

  • "Just a dang good service!"

    @golferski

  • "Worth every penny."

    Steve Hougom

  • "It’s been a life saver."

    Maria Halt

  • "Best support site I’ve seen!"

    Bob Schneider

  • "I would be lost without them."

    @fblack61

  • "Saved my job multiple times."

    Walt Forbes

  • "I love this site."

    Maria Duwe

  • "Friendly respectful help."

    Andrew Kowtalo

  • "Such top-notch experts."

    @magento

  • "The best money I have ever spent."

    @rwheeler23

  • "Beyond any comprehensible value"

    George Morris

  • "Invaluable tool for our organization"

    Josh Regalski

Read over 600 more reviews

TRUSTED BY

IBM logoIntel logoMicrosoft logoUbisoft logoSAP logo
Qualcomm logoCitrix Systems logoWorkday logoErnst & Young logo
High performer badgeUsers love us badge
LinkedIn logoFacebook logoX logoInstagram logoTikTok logoYouTube logo
© 1996-2023 Experts Exchange, LLC. All rights reserved. Covered by US Patent