asked on

CAN'T LOAD OTHER IMAGES

a GUY HELPED ME out with this code the only thing is is that if a different xml file is used the Ballpark field doesnot load.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>SportsNetwork</title>
<style>
#teamH { float:left}
#teamA { float:right}
#content { width:500px}
#img { }
.caption {text-align:center; margin:auto; font-weight: bold}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script>

stadiums = {
"wrigley field":"wrigley.gif",
"comerica park":"comerica.gif" ,
"yankee stadium":"yankee.jpg" ,
"shea stadium":"shea.jpg" ,
"angel stadium of anaheim":"angel.jpg" ,
"rangers ballpark in arlington":"angel.jpg" ,
"at&t park":"attpark.jpg" ,
"citizens bank park":"citizenballpark.jpg" ,
"coors field":"coors.jpg" ,
"busch stadium":"busch.jpg" ,
"oriole park at camden yards":"camden_baltimore.jpg"
,"dodger stadium":"dodgers.jpg" ,
"chase field":"chasefield.jpg" ,
"tropicana field":"tropicana.jpg" ,
"great american ball park":"greatamerican.jpg" ,
"kauffman stadium":"kauffmanstadium.jpg" ,
"mcafee coliseum":"mcafeecoliseum.jpg" ,
"hubert h. humphrey metrodome":"metrodome.jpg" ,
"metrodome":"metrodome.jpg" ,
"miller park":"millerpark.jpg" ,
"minute maid park":"minutemaid.jpg" ,
"nationals park":"nationalspark.jpg" ,
"petco park":"petcopark.jpg" ,
"petco park":"petcopark.jpg" ,
"pnc park":"pncpark.jpg" ,
"progressive field":"progressive.jpg" ,
"rogers centre":"rogerscentre.jpg" ,
"safeco field":"safecofield.jpg" ,
"turner field":"turnerfield.jpg" ,
"dolphin stadium":"dolphinstadium.jpg" ,
"fenway park":"fenwaypark.jpg" ,
"u.s. cellular field":"uscellularfield.jpg" ,
"oakland-alameda county coliseum": "mcafeecoliseum.jpg"
} // no comma on the last
var homeTurf = {
"philadelphia":"Citizens bank park",
"milwaukee":"Miller park"
}
// or simply have
/*
var homeTurf = {
"philadelphia":"citizensballpark.jpg",
"milwaukee":"millerpark.jpg"
}
*/

$(document).ready(function(){
$.ajax({
type: "GET",
url: "33661.XML",
dataType: "xml",
success: function(data){
var Teams = $(data).find("Team");
$.each(Teams,function(i,Team) {
team=$(Team);
var id = team.attr("ID").toLowerCase();
var teamLogo = $("<img/>").attr("src","http://images.sportsnetwork.com/MLB/attheballpark/pbp_logos/" + id + ".png");
var homeOrAway = team.attr("vh");
$("#team"+homeOrAway).append(teamLogo);
if (homeOrAway=="H") {
var stadium_location = stadiums[homeTurf[name].toLowerCase()]; // or have
var url = "http://images.sportsnetwork.com/mlb/attheballpark/stadiums/";
url = (stadium_location) ?url + stadium_location:"default.gif";
$("#imgDiv").append('<img src="'+url+'"/>').append('<br/><div class="caption">'+homeTurf[name]+'</div>');
}

});
}
});
});

</script>
</head>
<body>
<div id="content">
<span id="teamH"></span>
<span id="teamA"></span><br/>
<div id="scoreboard"></div><br/>
<div id="imgDiv"></div>

</div>
</body>
</html>
Can anyone know how to use entire list to load correct staduim I attached a different XML so you can test it.Everytime I edit any of these files I end up getting blank pages. mplungjan has done some amazing work for me I can't afford to pay him if I had money or controled the cash at my gig I would pay him however I might get him some lottery tickets
33661.XML
33662.xml

nap0leon

with

url: "33662.XML"

Open in new window

the page shows images for Angels and Giants

with

url: "33661.XML"

Open in new window

the page shows images for Brewers and Phillies.

What is the issue?

Tom Powers

ASKER

The stadium is suppose to load under two team logos that's all the code for stadiums

stadiums = {
"wrigley field":"wrigley.gif",
"comerica park":"comerica.gif" ,
"yankee stadium":"yankee.jpg" ,
"shea stadium":"shea.jpg" ,
"angel stadium of anaheim":"angel.jpg" ,
"rangers ballpark in arlington":"angel.jpg" ,
"at&t park":"attpark.jpg" ,
"citizens bank park":"citizenballpark.jpg" ,
"coors field":"coors.jpg" ,
"busch stadium":"busch.jpg" ,
"oriole park at camden yards":"camden_baltimore.jpg"
,"dodger stadium":"dodgers.jpg" ,
"chase field":"chasefield.jpg" ,
"tropicana field":"tropicana.jpg" ,
"great american ball park":"greatamerican.jpg" ,
"kauffman stadium":"kauffmanstadium.jpg" ,
"mcafee coliseum":"mcafeecoliseum.jpg" ,
"hubert h. humphrey metrodome":"metrodome.jpg" ,
"metrodome":"metrodome.jpg" ,
"miller park":"millerpark.jpg" ,
"minute maid park":"minutemaid.jpg" ,
"nationals park":"nationalspark.jpg" ,
"petco park":"petcopark.jpg" ,
"petco park":"petcopark.jpg" ,
"pnc park":"pncpark.jpg" ,
"progressive field":"progressive.jpg" ,
"rogers centre":"rogerscentre.jpg" ,
"safeco field":"safecofield.jpg" ,
"turner field":"turnerfield.jpg" ,
"dolphin stadium":"dolphinstadium.jpg" ,
"fenway park":"fenwaypark.jpg" ,
"u.s. cellular field":"uscellularfield.jpg" ,
"oakland-alameda county coliseum": "mcafeecoliseum.jpg"
} // no comma on the last
This Part is suppose to load stadium based on Location Name in xml file here is the call for the stadiums
var url = "http://images.sportsnetwork.com/mlb/attheballpark/stadiums/";
url = (stadium_location) ?url + stadium_location:"default.gif";
$("#imgDiv").append('<img src="'+url+'"/>').append('<br/><div class="caption">'+homeTurf[name]+'</div>');

Tom Powers

ASKER

In xml file location has the name of the stadium to be loaded and the stadiums function above is supposed to load the staduim image based on Location name match. Hope that explains it better.

ASKER CERTIFIED SOLUTION

nap0leon

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

See answer

Tom Powers

ASKER

I understand now thanks to you. Your great.