Solved

display xml data in a html table

Posted on 2013-12-09
19
410 Views
Last Modified: 2013-12-13
I have a working copy of a web page of what I kinda want I tried to take what I needed  and then run the page but I am not getting the results I want I have two drop downs that will allow you set filter based on peroid and action type, Should be cool as long I can get the help the get it done.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>The Sports Network 2014 Gamecast</title>
<link rel="stylesheet" href="css/jquery-ui-1.8.9.customver1.css">
<style type="text/css">
			#playLogScroll {
	height: 360px;
	overflow-y: scroll;
	width: 400PX;
	border: 1px solid grey;
}
			#playLogTemplate { display: none; }
			#playLog, #currentPlay { width: 350px; }
			#playLog col:nth-child(1), #currentPlay col:nth-child(1) { width: 17%; }
			#playLog col:nth-child(2), #currentPlay col:nth-child(2) { width: 17%; }
			#playLog col:nth-child(3), #currentPlay col:nth-child(3) { width: 20%; }
			#playLog col:nth-child(4), #currentPlay col:nth-child(4) { width: 46%; }
			
			#playLog tr.hidden { display:none }
			#teamHeaders .teamColour { display:inline-block; height: 30px; width: 50px; }
		</style>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
		<script type="text/javascript">
		var QueryString = function () {
	var query_string = {};
	var query = window.location.search.substring(1);
	var vars = query.split("&");
	for (var i=0;i<vars.length;i++) {
		var pair = vars[i].split("=");
		// If first entry with this name
		if (typeof query_string[pair[0]] === "undefined") {
			query_string[pair[0]] = pair[1];
		// If second entry with this name
		} else if (typeof query_string[pair[0]] === "string") {
			var arr = [ query_string[pair[0]], pair[1] ];
			query_string[pair[0]] = arr;
		// If third or later entry with this name
		} else {
			query_string[pair[0]].push(pair[1]);
		}
	} 
	return query_string;
} ();  
		
		
		
       function applyFilter() {
			console.log("Filtering on: " + $('#playType').val());

			//store the Filter type for later use
			$(this).data('appliedFilter', $('#playType').val());
			
			//before applying a new filter, clear the old one
			$('#playLog tr.hidden').removeClass('hidden');
			
			//if Show All isn't selected, we need to hide some rows
			if ($('#playType').val() != "Show All") {
				playsToHide = $('#playLog tr').filter(function() {
					return $(this).data('playType') != $('#playType').val();
				}).addClass('hidden');
			}
		} 
        $(document).ready(function() {
			//The DOMs ready so lets get started
			getData();
			
			$('#applyFilter').click(applyFilter);
		});
		function getData() {
			//grab the XML file with an AJAX request. Once we've got it, call the processGame function
			xmlPath = '/xml/nhl/scores/real';
			 var xmlGameID = QueryString.gameID;
			gameFile = xmlPath + '/' + xmlGameID + '.xml',

			$.ajaxSetup({ cache: false });
			$.ajax({
				type: "GET",
                    url: xmlPath +"/"+xmlGameID+".xml",
				dataType: "xml"
			})
			.done(processGame)
			.fail()
			.always();
		}
				function processGame(gameData) {
			//convert the XML into a jQuery object
			game = $(gameData);
			currentPlay = game.find('Play').first();
			
			//set a timer to run the script again in 2 seconds
			setTimeout(getData,2000);

			//do we have new plays
			if (currentPlay.attr('Seq') == $('#currentPlay').data('currentSeq')) {
				console.log("No New Plays");
				return;
			}



			//set up the Team Headers
			teams = new Array();
			teams.push(game.find('Team[vh="A"]').attr('ID'));			
			teams.push(game.find('Team[vh="H"]').attr('ID'));

			

			

			//set up the Current Play
			currentPlayTable = $('#currentPlay');
			currentPlayTable.data('currentSeq', currentPlay.attr('Seq'));
			playInfo = getPlayInfo(currentPlay);

			$('td:nth-child(1)', currentPlayTable).html( $('<img>').attr('src', playInfo.teamImg ) );
			$('td:nth-child(2)', currentPlayTable).html( $('<img>').attr('src', playInfo.playerImg ) );
			$('td:nth-child(3)', currentPlayTable).html( playInfo.playType );
			$('td:nth-child(4)', currentPlayTable).html( playInfo.playNarr );
			
			//add the play type to the filter dropdown
			if (!$("#playType option[value='" + playInfo.playType + "']").length) {
				$('#playType').append($('<option>').text( playInfo.playType ).val( playInfo.playType ));	
			};



			//set up the Previous Plays
			lastPlay = $('#playLog tbody tr:first');
			lastPlay = (lastPlay.data('playSeq')) ? lastPlay.data('playSeq') : 0;
			
			//get the Seq of the play in the currentPlay table
			currentPlay = $('#currentPlay').data('currentSeq');
			
			//get the previous plays. This is a list of plays where the Seq is greater than the last play added and less than the current play
			previousPlays = $('PreviousPlays Play', game).filter(function() {
				return (parseInt($(this).attr('Seq')) > parseInt(lastPlay) && parseInt($(this).attr('Seq')) < parseInt(currentPlay))
			});

			setPreviousPlays(previousPlays);



			
			
		}
		function getPlayInfo(play) {
			var teamID, playerID;
			var playTypes = {
				"GOAL": {subnode: 'Goal', teamidnode: 'ScoreTeamID', playeridnode: 'ScoreID'},
				"MISSED": {subnode: 'Missed', teamidnode: 'ShootTeamID', playeridnode: 'ShootID'},
				"BLOCKED": {subnode: 'Blocked', teamidnode: 'ShootTeamID', playeridnode: 'ShootID'},
				"ONGOAL": {subnode: 'OnGoal', teamidnode: 'ShootTeamID', playeridnode: 'ShootID'},
				"HIT": {subnode: 'Hit', teamidnode: 'HitTeamID', playeridnode: 'HitID'},
				"PENL": {subnode: 'Penalty', teamidnode: 'PONTeamID', playeridnode: 'PONID'}
			};
			
			if ( playInfo = $(playTypes).attr( play.attr('PlayType')) ) {
				teamID = play.find(playInfo.subnode).attr(playInfo.teamidnode);
				playerID = play.find(playInfo.subnode).attr(playInfo.playeridnode);
			}

			return {
				'teamImg'	: (teamID) ? 'http://images.sportsnetwork.com/nhl/attherink/logos/' + teamID + '.png': 'http://powerzsoftware.com/tsn/IMAGES/NHLLOGOX.png',
				'playerImg'	: (playerID) ? 'http://images.sportsnetwork.com/NHL/attherink/players/' + playerID + '.jpg' : 'http://powerzsoftware.com/tsn/IMAGES/sKATE.png',
				'playType'	: play.attr('PlayType'),
				'playNarr'	: play.find('narrative').attr('text')
			}
		}
		
		
		
		function setPreviousPlays(previousPlays) {
			console.log('Previous Plays');
			
			$(previousPlays).each(function(i, play) {
				playInfo = getPlayInfo($(play));
				
				//add the play types to the drop down
				if (!$("#playType option[value='" + $(this).attr('PlayType') + "']").length) {
					$('#playType').append($('<option>').text($(this).attr('PlayType')).val($(this).attr('PlayType')));	
				};
				
				newRow = $('<tr>')
					.data({ playType: playInfo.playType, playSeq : $(play).attr('Seq') })					.append( $('<td>').html( $('<img>').attr('src', playInfo.teamImg)))
					.append($('<td>').html( $(play).attr('Quarter')));
					.append( $('<td>').html( $(play).attr('TimeLeft')));
					.append( $('<td>').html( playInfo.playType ).append( $('<img>').attr('src', playInfo.playerImg)));
					.append( $('<td>').html(playInfo.playNarr));
					
					
					
					
				
				//do we need to hide the play based on the filter?
				appliedFilter = $('#applyFilter').data('appliedFilter');
				if (appliedFilter && appliedFilter != "Show All" && $(this).attr('PlayType') != appliedFilter) {
					newRow.addClass('hidden');
				}
					
				newRow.appendTo('#playLog tbody');
			})
			
		}
        </script>
        </head>


<body>
<table width="400" border="0">
  <tr>
    <td colspan="5" class="GCPBP"><div align="center" id="PRD">ICE LOG PERIOD </div></td>
  </tr>
  <tr>
    <td colspan="5"><div align="left"><strong><em>Periods </em></strong>
      <select name="ddlnhl" id="ddlnhl">
        <option>1st Period</option>
        <option>2nd Period</option>
        <option>3rd Period</option>
        <option>Overtime</option>
        <option>ShootOut</option>
        <option>Overtime 1</option>
        <option>Overtime 2</option>
        <option>Overtime 3</option>
      </select>
      <button ="submit" id="applyFilter" value="Go!" /button>
      Action
      <label for="ddlnhl"></label>
    <select name="ddlnhl2" id="ddlnhl2">
</select>
    </div></td>
  </tr>
  <tr class="GCPBP">
    <td width="56"><div align="center">Team</div></td>
    <td width="68"><div align="center">PRD</div></td>
    <td width="73"><div align="center">TIME LEFT</div></td>
    <td width="23"><div align="center">ACTION</div></td>
    <td width="158">Gameplay Description</td>
  </tr>
</table>
<div id="playLogScroll">
  <table id="playLog">
    <colgroup>
      <col>
      <col>
      <col>
      <col>
    </colgroup>
    <tbody>
    </tbody>
  </table>
</div>
<p>&nbsp;</p>
</body>
</html>

Open in new window

attached is css and html doc thanks EE YOUR THE BEST
ICElOG.html
18185.XML
0
Comment
Question by:powerztom
  • 10
  • 9
19 Comments
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Hey Tom,

Not sure I entirely follow.

Do you just want to load up all the data and then filter it on Period and Play Type.

In your HTML, the Period drop-down has options for 1st, 2nd 3rd Period, Overtime 1, 2, 3, Overtime and ShootOut but your XML file only seems to hold info for Quarter 1, 2, 3, 4 and 5 !!!
0
 

Author Comment

by:powerztom
Comment Utility
Chris,

I know it's confusing and probably hard as hell to do but if you can detect what quarter it is load that quarter based on quarter attribute  load all data related to that quarter then let's say the 2nd quarter begins only second quarter dat gwt loaded based on attribute 2nd quarter I'll be able hopefully do overtime and shoot out based on who you code 1,2 and 3.
Yes I'd like to filter by playtype or period. A know it seems like a lot to ask but i really could use your expertise. To make things clear here is a link to our flash project that we are going to replace This will give you a better understanding Any questions just let me know thanks brother

At Bottom click 123 number buttons then click play and watch the plays come in
Ice Hockey


The last part to this project is canvas with dots indicating shots that get tooltips.
0
 

Author Comment

by:powerztom
Comment Utility
Did I stump the GENUIS ?
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Been a really busy day dealing with clients so haven't had a look yet...

May have a look at it in a minute or two ;)

Stay tuned
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Hey Tom,

Have a play with this. I've cut out some of the functionality so it's easier to see what's going on. Basically, when you put each 'play' into the playLog table, you add data attributes to the rows for the playPeriod and playType. You'll filter the rows on these values later.

The 2 dropdowns fire the filter when they're changed (saves clicking a button).

If there's something you don't understand, just ask :)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Q_28314146 // Chris Stanyon</title>
<meta name="author" content="Chris">
<link rel="stylesheet" href="styles.css" type="text/css" media="screen" charset="utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	getData();
	$('#filterPeriod, #filterAction').change(applyFilter);
});


function getData() {
	$.ajax({ url: 'data.xml' }).done(processGame);
}


function processGame(gameData) {
	game = $(gameData);
	plays = $('PreviousPlays Play', game);
	
	$(plays).each(function(i, play) {
		//add the play types to the drop down
		if (!$("#filterAction option[value='" + $(this).attr('PlayType') + "']").length) {
			$('#filterAction').append($('<option>').text($(this).attr('PlayType')).val($(this).attr('PlayType')));	
		};
				
		//create the play rows
		$('<tr>')
			.data({ playType: $(play).attr('PlayType'), playPeriod : $(play).attr('Quarter') })
			.append( $('<td>') )
			.append( $('<td>').html($(play).attr('Quarter')) )
			.append( $('<td>').html($(play).attr('TimeLeft')) )
			.append( $('<td>').html($(play).attr('PlayType')) )
			.append( $('<td>') )
			.appendTo('#playLog tbody')
	})
}


function applyFilter() {
	var actionFilter = $('#filterAction').val();
	var periodFilter = $('#filterPeriod').val();

	//before applying a new filter, clear the old one
	$('#playLog tr.hidden').removeClass('hidden');
	
	//if Show All isn't selected, we need to hide some rows	
	if (periodFilter != 'Show All') {
		$('#playLog tr').filter(function() {
			return $(this).data('playPeriod') != periodFilter;
		}).addClass('hidden');
	}

	if (actionFilter != 'Show All') {
		$('#playLog tr').filter(function() {
			return $(this).data('playType') != actionFilter;
		}).addClass('hidden');
	}
}
</script>
</head>
<body>

<table width="400" border="0">
	<colgroup><col><col><col><col><col></colgroup>
	<tr><th colspan="5" >ICE LOG PERIOD</th></tr>
	<tr><td colspan="5">
		<label>Period</label>
		<select id="filterPeriod">
			<option>Show All</option>
			<option value="1">1st Period</option>
			<option value="2">2nd Period</option>
			<option value="3">3rd Period</option>
			<option value="4">Overtime</option>
			<option value="5">ShootOut</option>
		</select>
		<label>Action</label>
		<select id="filterAction">
			<option>Show All</option>
		</select>
	</td></tr>
	<tr>
		<td>Team</td>
		<td>PRD</td>
		<td>TIME LEFT</td>
		<td>ACTION</td>
		<td>Gameplay Description</td>
	</tr>
</table>

<div id="playLogScroll">
<table id="playLog">
	<colgroup><col><col><col><col><col></colgroup>
	<tbody></tbody>
</table>
</div>
	

</body>
</html>

Open in new window

0
 

Author Comment

by:powerztom
Comment Utility
Chris,

I started adjusting code the way I wanted but then I stopped before I did damage.
The dropdowns don't work. the header needs to be frozen which I think it is I created a div for data below header I want the div to have a scroll the moves up and down. For team column team logo and player headshot in same cell as playtype and description is missing.

Please Please don't think I'm bitching I'm in no way Bitching just stating what will make this great. And what you did so far has been a good learning experience for me. What do you use? Dreamweaver or Visual Studio or are you one of those guys that use notepad? Attached is your sheet with added div for scroll. and a xml so you can test. Thanks Chris i TRIED TO PLUG IN SOME CODE FROM YOU AND OTHER EE GUYS BUT I DIDN'T HAVE ANY LUCK.


i MADE A GRAPHICAL Rep of what I trying to get to. now just note that the order of data in each row is out of whack. But I hope this helpsGraphic I appreciate your help big time.
Dropdown.html
ICEHOCKEY.png
0
 

Author Comment

by:powerztom
Comment Utility
Chris,

I wanted to tell you that we have score keepers here and during a game they update the same xml doc FOR THE GAME THERE DOING.that's why I use Timers all the time. It's not just one xml file then my job is done No my Good man I have to use timers that look for next file(Same file name just data updated). And Hockey is the worse cause it comes from the NHL AND THE SEQ NUMBERS ARE TOTALLY WHACKED ONE FILE IS 10002929 THE NEXT IS10003045 THEN IT MAY DIP DOWN LIKE 10002925. So the one Constant is quarter or period so I  grab all then look for next file whether it be greater then of less then the current seq number. Most of the times the seq of number will be greater.
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Hey Tom,

No worries. My previous comments about your timers has not been aimed at having a timer - it was just the way you were using them.

I haven't used DreamWeaver for years - it produces ugly, bloated code that's a nightmare to maintain - I use an IDE called Aptana Studio - like a really fancy notepad :)

What is the purpose of the SEQ numbers if you can't rely on them to be in order - if they're not in order, then how is it possible to know what order the game plays happened.

In computer tech development there's an abbreviation - GIGO - Garbage In Garbage Out - it means that no matter how advanced or clever the code is, if the person inputting data puts in crap then the system won't work. Period!

The code I provided works as it is - it filters the data when you change either of the 2 dropdowns.

Are you needing this code to have a timer for 'live' games or do you just intent to pull data from a static XML file.
0
 
LVL 42

Accepted Solution

by:
Chris Stanyon earned 500 total points
Comment Utility
Right, have a look at this.

It seems to resemble what you're after but I haven't set up any timers to reload data, because like I said - if you Seq numbers are out of whack, there's no reliable way of loading data on a ongoing basis - you won't be able to tell what are new plays and what are old ones. You could probably 'hack' it to work, but you're asking for trouble if you do that - your best bet is to sort out the source of the problem - the XML data file.

Also, FYI - you have a player image missing (Jermey Morin - Chicago Blackhawks) - I'm getting a 404 for this image:

http://images.sportsnetwork.com/NHL/attherink/players/2944.jpg

Anyway, have a play and see how you get on :)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Q_28314146 // Chris Stanyon</title>
<meta name="author" content="Chris">
<style type="text/css" media="screen">
	body { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 12px; }
	#playLogScroll { height: 360px;  overflow-y: scroll; width: 417px; }
	#playLog, #headers { width: 400px; }
	#headers th { background-color: #2579AB;padding: 3px; color: white; }
	#playLog col:nth-child(1), #headers col:nth-child(1) { width: 15%; }
	#playLog col:nth-child(2), #headers col:nth-child(2) { width: 10%; }
	#playLog col:nth-child(3), #headers col:nth-child(3) { width: 15%; }
	#playLog col:nth-child(4), #headers col:nth-child(4) { width: 20%; }
	#playLog col:nth-child(5), #headers col:nth-child(5) { width: 40%; }
	#playLog tr.hidden { display:none }
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	getData();
	$('#filterPeriod, #filterAction').change(applyFilter);
});


function getData() {
	$.ajax({ url: 'data.xml' }).done(processGame);
}


function processGame(gameData) {
	plays = $('PreviousPlays Play', $(gameData));

	$(plays).each(function(i, play) {
		playInfo = getPlayInfo($(play));
	
		//add the play types to the drop down
		if (!$("#filterAction option[value='" + $(this).attr('PlayType') + "']").length) {
			$('#filterAction').append($('<option>').text($(this).attr('PlayType')).val($(this).attr('PlayType')));	
		};
				
		//create the play rows
		$('<tr>')
			.data({ playType: $(play).attr('PlayType'), playPeriod : $(play).attr('Quarter'), playSeq : $(play).attr('Seq') })
			.append( $('<td>').html($('<img>').attr('src', playInfo.teamImg)) )
			.append( $('<td>').html($(play).attr('Quarter')) )
			.append( $('<td>').html($(play).attr('TimeLeft')) )
			.append( $('<td>').html( playInfo.playType ).append( $('<img>').attr('src', playInfo.playerImg)))
			.append( $('<td>').html(playInfo.playNarr))
			.appendTo('#playLog tbody');
	});
}


function applyFilter() {
	var actionFilter = $('#filterAction').val();
	var periodFilter = $('#filterPeriod').val();

	//before applying a new filter, clear the old one
	$('#playLog tr.hidden').removeClass('hidden');
	
	//if Show All isn't selected, we need to hide some rows	
	if (periodFilter != 'Show All') {
		$('#playLog tr').filter(function() {
			return $(this).data('playPeriod') != periodFilter;
		}).addClass('hidden');
	}

	if (actionFilter != 'Show All') {
		$('#playLog tr').filter(function() {
			return $(this).data('playType') != actionFilter;
		}).addClass('hidden');
	}
}


function getPlayInfo(play) {
	var teamID, playerID;
	var playTypes = {
		"GOAL": {subnode: 'Goal', teamidnode: 'ScoreTeamID', playeridnode: 'ScoreID'},
		"MISSED": {subnode: 'Missed', teamidnode: 'ShootTeamID', playeridnode: 'ShootID'},
		"BLOCKED": {subnode: 'Blocked', teamidnode: 'ShootTeamID', playeridnode: 'ShootID'},
		"ONGOAL": {subnode: 'OnGoal', teamidnode: 'ShootTeamID', playeridnode: 'ShootID'},
		"HIT": {subnode: 'Hit', teamidnode: 'HitTeamID', playeridnode: 'HitID'},
		"PENL": {subnode: 'Penalty', teamidnode: 'PONTeamID', playeridnode: 'PONID'}
	};
	
	if ( playInfo = $(playTypes).attr( play.attr('PlayType')) ) {
		teamID = play.find(playInfo.subnode).attr(playInfo.teamidnode);
		playerID = play.find(playInfo.subnode).attr(playInfo.playeridnode);
	}

	return {
		'teamImg'	: (teamID) ? 'http://images.sportsnetwork.com/nhl/attherink/logos/' + teamID + '.png': 'http://powerzsoftware.com/tsn/IMAGES/NHLLOGOX.png',
		'playerImg'	: (playerID) ? 'http://images.sportsnetwork.com/nhl/attherink/players/' + playerID + '.jpg' : 'http://powerzsoftware.com/tsn/IMAGES/sKATE.png',
		'playType'	: play.attr('PlayType'),
		'playNarr'	: play.find('narrative').attr('text')
	}
}
</script>
</head>
<body>

<table id="headers">
	<colgroup><col><col><col><col><col></colgroup>
	<tr><th colspan="5">ICE LOG PERIOD</th></tr>
	<tr><td colspan="5">
		<label>Period</label>
		<select id="filterPeriod">
			<option>Show All</option>
			<option value="1">1st Period</option>
			<option value="2">2nd Period</option>
			<option value="3">3rd Period</option>
			<option value="4">Overtime</option>
			<option value="5">ShootOut</option>
		</select>
		<label>Action</label>
		<select id="filterAction">
			<option>Show All</option>
		</select>
	</td></tr>
	<tr>
		<th>Team</th>
		<th>PRD</th>
		<th>TIME LEFT</th>
		<th>ACTION</th>
		<th>Gameplay Description</th>
	</tr>
</table>

<div id="playLogScroll">
<table id="playLog">
	<colgroup><col><col><col><col><col></colgroup>
	<tbody></tbody>
</table>
</div>
	
</body>
</html>

Open in new window

0
Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

 

Author Comment

by:powerztom
Comment Utility
About seq files for hockey unlike basketball, hockey, football and baseball the aren't in consecutive order. I know why it how they transmit So there is nothing we can do exceptSo for hockey detect quarter then grab everything from that quarter until it ends then next quarter erase previous quarter then grab everything anything for new quarter. Your code displays I'm not criticizing your code you are a God when it comes to this but can you put data in a 400 by 450 div that scrolls and have team logo/peroiod/timeleft/playytype with headshot/ gameplay you did it before with a frozen header.  Please Man just look at image above. the dropdowns are working for me on my side I'm using  is  Aptana Studio free?


var xmlPath = '/xml/nhl/scores/real';
 var xmlGameID = "18178"
function getData() {
      $.ajax({ url: xmlPath +"/"+xmlGameID+".xml"}).done(processGame);
}
Dropdown.html
jquery-ui-1.8.9.customver1.css
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Yes - Aptana Studio is free :)

The code I've just posted includes the headshots and team logos etc, so give that a go. It also includes a static header and scrolling game log.

Should do exactly what you need.

Still unsure about the Seq numbers. If they're not in order, then what's the point of them! Hassle the authors and tell them to get it right! Data integrity is fundamental to this type of thing.
0
 

Author Comment

by:powerztom
Comment Utility
Chris u made this like this look at attachment  But this is what I'm after YOU WROTE GAMELOG.HTML Dude I'm DOWNLOADING Aptana Studio SCREW dw. Do me a favor look at attachment
18169.XML
Gamelog.html
0
 

Author Closing Comment

by:powerztom
Comment Utility
Stop Perfect I was looking at a code posting in the beginning Looks great man.Awesome

Again I missed your 2nd posting my bad Looks WICKED!!!! Thanks Chris am going to study your code
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
am going to study your code

Best way to learn dude!

There is a learning curve with Aptana, but it's a great tool for serious development. Hand-crafted code is ALWAYS better than program-generated and your skill-set will rocket :)
0
 

Author Comment

by:powerztom
Comment Utility
Chris here a quick 500 I need the ajax call to work with a network path and querystring.
I tried it
function getData() {
      $.ajax({ url: 'data.xml' }).done(processGame); works

}

Mine

function getData() {
      $.ajax({ url: xmlPath+"/"+xmlGameID+ ".xml"}).done(processGame);
}

What is .done(processGame) are you chaining functions to an action or am I way off ?
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
When making an AJAX request, it's common to do something when the request finishes. The ajax() method has 3 methods to help you with this:

done() - runs when the AJAX request is successful
fail() - runs when there's an error
always() - runs when the request is finished, regardless of success or failure.

You can either pass an anonymous function to these methods or call an existing function

//anonymous function
$.ajax({ ajax options }).done( function(response) { //do something with the response });

//existing function
$.ajax({ ajax options }).done( someExistingFunction );

In your case, I created a function called processGame which is run once your ajax request is complete.

I can't see anything wrong with your code, as long as you're correctly setting the 2 variables - xmlPath and xmlGameID.
0
 

Author Comment

by:powerztom
Comment Utility
Chris I was doing alot yesterday. I downloaded Aptana Studio  it didn't look user friendly but like you said it will probably make me a better programmer I put in a ticket for the ajax call it works locally static but if you use a network path you don't get anything I tried Basketball which all works it's the ajax single line call. If you read the ticket I went into a little bit of detail. Anyway I fucking love the control that I'm dieing to put on hockey website the gameID AND XMLPATH ID ARE Both correct. If you could check it out that would be great.
Cause your way better then most experts.
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Already commented on it - I think your problem is because of absolute and relative paths - a leading forward slash...although I can't test it - posting a link to the site will make it a little easier for me to see

Cheers for the compliment :)
0
 

Author Comment

by:powerztom
Comment Utility
Chris are you around or out ? I got a two parter one is about using a button for that game log you made. I created a image and click applyfilter that's the right function? Zimmergeek and me are taking stabs at http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28317959.html


this is just like the page you had done for me And for practice I wanted to see if I could use what you wrote adjust it to fit me but something isn't right. Hoping your around but it's probably too late unless your pulling a all nighter any way your expertise would be greatly appreciated.
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now