Solved

Can I pass a number to url line and have html page grab it and use it html pages but not active server pages

Posted on 2013-11-26
10
419 Views
Last Modified: 2013-11-27
Can I pass a url and number representing a ID TO URL Line and have it grabbed and used by a html 5 Page I know you can do this in asp and aspx pages but I wanted to know first if you could do it with standard html pages. like code samples listed below
var newLink = $('<a>')
    .attr('href', '#')
    .text( $('status', game).text() )
    .data('gameID', $('game_id', game).text() )
    .click( function(e) {
       e.preventDefault();
      window.location =
                        "DailyNCAA.html#" + $('game_id', game).text();
    });
on another html page below the number 39288 is just a hardcoded number means nothing the value I'm trying to pass and intercept would be the xmlGameID value.

 var xmlPath = '/xml/cfoot/scores/real';
                  xmlGameID = '39288';
                  gameFile = xmlPath + "/" + xmlGameID + '_' + "DRIVE.xml",

                  $.ajaxSetup({ cache: false });
                  $.ajax({
                        url: gameFile,
                        dataType: "xml"
                  })
THE value of the xmlGameID is what I would like to be captured in url line. Past from first page.If the only way is asp and aspx pages then I'll have to deal with it and go that route.
Beware of xml Drive file EE Site changes the _Drive.xml to -Drive.xml Just so you know
DailyNCAA.html
NCAAFB.xml
GamelogfilterC.html
39288-DRIVE.XML
0
Comment
Question by:powerztom
  • 4
  • 4
  • 2
10 Comments
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Hey Tom,

It is easier using a server side script - personally I use PHP. Basically you would call the page with a query string:

window.location = "DailyNCAA.php?gameID=" + $('game_id', game).text();

Open in new window

And then in the DailyNCAA.php page you would grab the value from the GET array:

<?php printf("xmlGameID = '%s';", $_GET['gameID']) ?>

Open in new window

0
 
LVL 32

Assisted Solution

by:Big Monty
Big Monty earned 100 total points
Comment Utility
if you want strictly a client side solution, you can use this function:

var QueryString = function () {
  // This function is anonymous, is executed immediately and 
  // the return value is assigned to QueryString!
  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;
} ();

Open in new window


then you would access the querystring variable gameID like:

var gameID = QueryString.gameID
0
 

Author Comment

by:powerztom
Comment Utility
i KNOW Server Side is way to go but right now I need this client side script to work. The_Big_Daddy work with me please I feel like this is it. I have scores page and link direct you to court4.html for this case example. Scores redirect looks like

var newLink = $('<a>')
    .attr('href', '#')
    .text( $('status', game).text() )
    .data('gameID', $('game_id', game).text() )
    .click( function(e) {
       e.preventDefault();
      window.location =
                        "court4.html#" + $('game_id', game).text();
    });


and I pasted this function var QueryString = function ()  into court4.html and Court4.html looks like

 var xmlPath = '.' //'/xml/nba/scores/real';
        var xmlGameID = QueryString.gameID
            $(document).ready(function(){
                  $.ajax({
                    type: "GET",
                    url: xmlPath + "/" + xmlGameID + ".xml",
                    dataType: "xml",

But I'm not getting proper output  this is court4 url dev.sportsnetwork.com/aspdata/nba2/court4.html#19039 Help me out Bro!
0
 
LVL 32

Expert Comment

by:Big Monty
Comment Utility
cant connect to dev.sportsnetwork.com/aspdata/nba2/court4.html#19039

first thing I would check is make sure your URL is correct. the one above doesn't have a gameID parameter in it, so i'm not surprised it didn't work :)

as a test, if you put court4.html?gameID=19039 directly into the address bar, does that work?
0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
Tom,

If you want to set the location when a link is clicked, then there's not need to bind a click event - just use the default behaviour of the A tag.

You also need to pass the gameID as a QueryString (?gameID=xxx) and not as a named anchor (#xxx):

var newLink = $('<a>')
    .attr('href', 'court4.html?gameID=' + $('game_id', game).text() )
    .text( $('status', game).text() );

Open in new window

0
Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

 

Author Comment

by:powerztom
Comment Utility
This Sucks I feel like I'm so dam close but no luck. I'll post code and attach
http://dev.sportsnetwork.com/aspdata/nba2/court4.html?gameID=19039 this is line that get pass to url line for court4.html it brings you to the default court graphic you can't see unfortunately I'll post code if still no luck I guess I'll have to got .net.

court4

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>The Court</title>


<style type="text/css">
body {
	background-color: #000;
}
#apDiv1 {
	position: absolute;
	width: 619px;
	height: 376px;
	z-index: 10;
	left: 66px;
	top: 13px;
}
.apdivtbheader {
	color: #FFF;
}
.centermid {
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size: 16px;
	font-weight: bold;
	color: #000;
	text-align: center;
	vertical-align: middle;
}
.headertop {
	color: #000080;
}

.whitetext {
	font-family: "Courier New", Courier, monospace;
	font-size:30px;
	font-style: italic;
	font-weight: bold;
	color: #FFF;
	text-decoration: blink;
}
</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/nba/scores/real';
        var xmlGameID = QueryString.gameID
		$(document).ready(function(){
			$.ajax({
                    type: "GET",
                    url: xmlPath + "/" + xmlGameID + ".xml",
                    dataType: "xml",
                    success: function (data) {
                        var d = $(data);
						 d.find('Team').each(function(i,Team){
          var team = $(Team);
          var vh = team.attr('vh'); // A or H...
          var sHomeOrAway = vh == 'H' ? 'home' : 'away';
          $('#txt' + sHomeOrAway).html(team.attr('name'));
		  if ($(Team).attr('vh') == "H") {
                        //convert the XML into a jQuery object
 $('#imgcourt').attr('src', 'http://dev.sportsnetwork.com/aspdata/nhl2/NBA/Images/Courts/' + team.attr('ID')  + '.png');
       $("btnv").click(function(){
    $("div8").toggle();
	var QueryString = function () {
  // This function is anonymous, is executed immediately and 
  // the return value is assigned to QueryString!
  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;
} ();
  });    
          // loadData();
							 }
        });
					
                   
                    }
                });	
	 });	
	
		//}

        
	
function loadData() {
	
	$.ajax({
		url: xmlPath + '/' + xmlGameID + '.xml',
		dataType: "xml"
	}).done(function(data) {
		gameData = $(data);

		play = $('Play', gameData);
		currentPlayer = $('Players Player', gameData);
		playerStats = $('Individual_Statistics Player', gameData).filter( function() { return $(this).attr('ID') == currentPlayer.attr('ID') });

		var tid = currentPlayer.attr('TeamID');
		var pid =  currentPlayer.attr('ID');  
		$('#imgplayer').attr("src","http://images.sportsnetwork.com/bask/nba/atthecourt/players/" + pid + ".jpg");
		$('#imgcenter').attr('src', 'http://dev.sportsnetwork.com/aspdata/nhl2/NBA/Images/NBAlOGOSZ/'+ tid +".png");
		$('#playerName').html( currentPlayer.attr('Firstname') + ' ' + currentPlayer.attr('Lastname') + ', ' + currentPlayer.attr('Position') );
		
		$('#txttimeleft').html( play.attr('TimeLeft') );
		$('#txtplaytype').html( play.attr('PlayType') );
		$('#txtpoints').html( playerStats.attr('Points') );
		$('#txtassists').html( playerStats.attr('Assists') );
		$('#txtgameplay').html( $('narrative', play).attr('text') );
		
		//setTimeout(loadData, 3000);
	});
}
</script>

C
</head>

<body>
<table width="750" border="0">
  <tr>
    <td><div align="center" id="div8">
      <div id="apDiv1">
        <table width="650" border="0">
          <tr class="headertop">
            <td width="217" bgcolor="#FFFFFF"><div align="center" id="playerName"></div></td>
            <td width="91" bgcolor="#FFFFFF"><div align="center"><strong>TimeLeft</strong></div></td>
            <td width="107" bgcolor="#FFFFFF"><div align="center"><strong>PlayType</strong></div></td>
            <td width="87" bgcolor="#FFFFFF"><div align="center"><strong>Points</strong></div></td>
            <td width="95" bgcolor="#FFFFFF"><div align="center"><strong>Assits</strong></div></td>
          </tr>
          <tr class="apdivtbheader">
            <td height="68" class="centermid"><p><img src="Images/misc/invisibleplayer.png" name="imgplayer" width="59" height="56" id="imgplayer"></p></td>
            <td class="centermid" id="txttimeleft"></td>
            <td class="centermid" id="txtplaytype"></td>
            <td class="centermid" id="txtpoints"></td>
            <td class="centermid whitetext" id="txtassists"></td>
          </tr>
        </table>
        <table width="120" border="0">
          <tr>
            <td><p class="centermid"><img src="Images/misc/invisibleteamlogo.png" name="imgcenter" width="133" height="117" id="imgcenter"></p></td>
          </tr>
</table>
        <table width="263" border="0">
          <tr>
            <td height="18" id="txtgameplay"><p class="centermid" id="txtgameplay">&nbsp;</p>
              <p class="centermid">&nbsp;</p></td>
          </tr>
    </table>
        
      </div>
    <img src="Images/Courts/096.png" width="625" height="375" id = "imgcourt"></div></td>
  </tr>
</table>
<script>
var myVar=setInterval(function(){myTimer()},1000);

function myTimer()
{

loadData();

}
</script>
</body>
</html>

Open in new window

0
 
LVL 42

Expert Comment

by:Chris Stanyon
Comment Utility
You're calling the QueryString function before you ever set it. Move the function definition outside of the document ready and move the call to it inside the document ready()
0
 
LVL 42

Accepted Solution

by:
Chris Stanyon earned 400 total points
Comment Utility
Actually, you can't move the call inside the document.ready block because you're loading the XML data (only you know why!!).

Just move the call to the function so it appears after the definition:

<script>
$(document).ready(function(){
	...
});	

function loadData() {
	...	
}

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;
} ();

var xmlPath = '/xml/nba/scores/real';
var xmlGameID = QueryString.gameID;
</script>

Open in new window

0
 

Author Closing Comment

by:powerztom
Comment Utility
For the love of God it worked my PC is crawling today everything I do is like a all day operation. Chris thanks so much I'm gonna give a few points to Big Daddy for helping Tonight I think I'm gonna drink beer. Thanks Chris your once again the hero of the day Metallica song.
Take care.
0
 

Author Comment

by:powerztom
Comment Utility
Chris great work on this I'm only contacting you cause you helped me with Starting five well one thing was there was no timer to updated stats during game so I added a second table with bench players but then the trouble started. I listed in the ticket what when wrong and it not that bad I good both tables to load correctly both niether table updates any stats just using the timer alter a player's xml stat it only gets updated if you manually refresh it. So if you have a moment cause that's probably all it will take for you to check it out that would be great. Thanks Chris

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28305717.html
0

Featured Post

Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Summernote and form validation 10 38
Why add + "" to end of  Math.random? 8 31
JQuery & CSS Tab Issues 7 26
XSLT Help 12 19
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
I was working on a PowerPoint add-in the other day and a client asked me "can you implement a feature which processes a chart when it's pasted into a slide from another deck?". It got me wondering how to hook into built-in ribbon events in Office.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. 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.: (CODE)

771 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

11 Experts available now in Live!

Get 1:1 Help Now