Programming Forums > Web Development and Design > JavaScript and Client-Side Browser Scripting

glevine · Aug 24th, 2005, 12:24 PM

I am currently trying to write a page to display data that is stored in external js files. On the first page, a user enters an id number and that is sent to a new page using a query string. the id # is then concatenated with 2 other pieces of data to form a string which represents the src of the external js file. I then need to grab data from a 4 dimensional array that resides in the js file, in the form:

(Toggle Plain Text)

var rawStats=[
	  ["0001","Y","Name Name","2005","R"],
["0001","Y","Name Name","2005","R"],
["0001","Y","Name Name","2005","R"],
[]
];

rawBatting.length=rawBatting.length-1; //to make up for that last empty row

I only need to access the name at this point, but I'm really not sure how to do that. All of my google searches and random trials haven't turned up anything yet. Thanks in advance for any help you can give me.

Here is the page I currently have written to display data:

(Toggle Plain Text)

<html>
<head>
<title>Batter</title>
</head>
<body>
<p><script language="JavaScript"><!--
function GetParam(param)
{
	var start=location.search.indexOf("?"+param+"=");
	if (start<0) start=location.search.indexOf("&"+param+"=");
 	if (start<0) return ' ';
 	start += param.length+2;
 	var end=location.search.indexOf("&",start)-1;
 	if (end<0) end=location.search.length;
 	var result=location.search.substring(start,end);
 	var result=' ';
 	for(var i=start;i<=end;i++)
 	{
 		var c=location.search.charAt(i);
 		result=result+(c=='+'?' ':c);
 	}
 	return unescape(result);
}

var jsfile=' ';
var jsfilesrc=' ';

if (location.search!='')
{
	document.write('This page was opened with the following data:<br>');
	document.write('Param id = ');
	document.write(GetParam('id'));
	jsfile='p'+GetParam('id')+'Bat.js';
	document.write('<br>JS File = '+jsfile);
	jsfilesrc='url/to/location/of/js/files'+jsfile;
	document.write('<br>jsfilesrc = '+jsfilesrc);
}
// --></script></p>
<p>
<script language="JavaScript" src=jsfilesrc><!--
//HERE'S WHERE I BELIEVE A FUNCTION NEEDS TO GO TO ACCESS DATA
// --></script>
</p>
</body>
</html>

Cerulean · Aug 24th, 2005, 1:44 PM

I'm still a little foggy on what needs to be done. Sounds like you want to have Page A, which has somewhere where you enter a number. Once you've done that, Page A will take the number and construct a filename, e.g user enters the number 3, and the script in Page A will make a filename of "somescript_3.js", for example. It will then request that script, and access a variable inside of it.
Is that what you're trying to do? If so, which precise parts do you need help with.

glevine · Aug 24th, 2005, 2:26 PM

Yes cerulean, that is exactly what I was hoping to do, except that Page B is the page that constructs the file name, etc. I'm sure you meant that, but I wanted to clarify.

The part I need help with is actually accessing/using the variable inside of the external script. I attempted to output rawBatting.length as an easy way to test that I could get something out of the script, but I ended up with no data being written to the page and IE said my page was written with errors. Of course the error it said existed was line 2 col 1, which is the beginning bracket of the html tag. So basically I need some assistance in taking the data from any variable in my ext js file and putting it on my webpage. Thanks.

Cerulean · Aug 24th, 2005, 2:58 PM

Quote:

except that Page B is the page that constructs the file name, etc. I'm sure you meant that, but I wanted to clarify.

Nope, I didn't mean that. So you want to pass the number to another page, and then receive what in return? For example, Page A requests Page B via the url "http://example.org/PageB?number=3". What type of file is Page B? A JavaScript script?

glevine · Aug 24th, 2005, 3:06 PM

Both Page A and Page B are html files. Page B constructs the script filename out of the parameter passed from Page A and tries to output the data that is stored in that script file.

Here is Page A:

(Toggle Plain Text)

<html>
<head>
<title>Find Player</title>
</head>

<body>
<form action="batter.html#ReceivingAndDecoding">
  <p>Enter id: <input type="text" size="20" name="id"> </p>
</form>
</form>
</body>
</html>

And here is Page B (the same as in my first post):

(Toggle Plain Text)

<html>
<head>
<title>Batter</title>
</head>
<body>
<p><script language="JavaScript"><!--
function GetParam(param)
{
	var start=location.search.indexOf("?"+param+"=");
	if (start<0) start=location.search.indexOf("&"+param+"=");
 	if (start<0) return ' ';
 	start += param.length+2;
 	var end=location.search.indexOf("&",start)-1;
 	if (end<0) end=location.search.length;
 	var result=location.search.substring(start,end);
 	var result=' ';
 	for(var i=start;i<=end;i++)
 	{
 		var c=location.search.charAt(i);
 		result=result+(c=='+'?' ':c);
 	}
 	return unescape(result);
}

var jsfile=' ';
var jsfilesrc=' ';

if (location.search!='')
{
	document.write('This page was opened with the following data:<br>');
	document.write('Param id = ');
	document.write(GetParam('id'));
	jsfile='p'+GetParam('id')+'Bat.js';
	document.write('<br>JS File = '+jsfile);
	jsfilesrc='url/to/location/of/js/files'+jsfile;
	document.write('<br>jsfilesrc = '+jsfilesrc);
}
// --></script></p>
<p>
<script language="JavaScript" src=jsfilesrc><!--
//HERE'S WHERE I BELIEVE A FUNCTION NEEDS TO GO TO ACCESS DATA
// --></script>
</p>
</body>
</html>

And of course an simplified example of a javascript file that I will using (since there are a few thousand that could be used depending on the id given) is in my first post.

Cerulean · Aug 24th, 2005, 4:19 PM

Ah, okay then. I assume you can't just cut Page B out of it and do it all from Page A? That would make much more sense to me, and I could show you what needs to be done. It's the same process that you'd undertake using two pages, so yeah.
There are a few ways you could go about doing this off the top of my head: The XmlHTTPRequest + eval way, and the DOM manipulation way.
The first method constructs the correct filename then requests that page via XmlHTTPRequest, and calls eval on the received data.
The second method uses DOM manipulation - it creates a new script element, sets it's src attribute, and then appends it to the body element or some such.
Cross browser support I know is good for the first method (all recent browsers supporting XmlHTTPRequest), and i'd assume support for the second is good even though i've only ever tried it with Gecko and KHTML.

glevine · Aug 24th, 2005, 4:31 PM

I have no problems doing this with only one page. I only started with this method because I am new to web programming (strictly C/C++ and bits of Java in school without going much beyond the command-line spectrum) so I am still getting familiar with the best solutions for web projects like this.

At the moment I only have to worry about myself and one other person using this page, so whichever method is easiest is just fine with me. As long as it works with Firefox or IE I am happy. Plus, I don't want to burden you too much. So, if you wouldn't mind showing me what needs to be done, I would really appreciate it. In the meantime I will be looking up references for both methods.

glevine · Aug 25th, 2005, 12:42 PM

Cerulean, or anyone for that matter, I was hoping I could get some help with using eval to parse the js file. I have used your suggestion to use XMLHttpRequest and I am able to receive a string containing all of the data in the file and to output it on the page. I have been trying to find good resources on how to use eval and how to parse strings in javascript, but I can't seem to find anything that has been helpful. And beyond that, is there a way to parse this response string so that it is possible have multidimensional arrays of 2-4 rows? I have some ideas, basically using the crap out substrings and the split function, but I was hoping someone might have a better way of doing this. Thanks again.

Aug 24th, 2005, 12:24 PM	#1
glevine Newbie Join Date: Jun 2005 Posts: 22 Rep Power: 0	external js file stores data I am currently trying to write a page to display data that is stored in external js files. On the first page, a user enters an id number and that is sent to a new page using a query string. the id # is then concatenated with 2 other pieces of data to form a string which represents the src of the external js file. I then need to grab data from a 4 dimensional array that resides in the js file, in the form: (Toggle Plain Text) var rawStats=[ ["0001","Y","Name Name","2005","R"], ["0001","Y","Name Name","2005","R"], ["0001","Y","Name Name","2005","R"], [] ]; rawBatting.length=rawBatting.length-1; //to make up for that last empty row var rawStats=[ ["0001","Y","Name Name","2005","R"], ["0001","Y","Name Name","2005","R"], ["0001","Y","Name Name","2005","R"], [] ]; rawBatting.length=rawBatting.length-1; //to make up for that last empty row I only need to access the name at this point, but I'm really not sure how to do that. All of my google searches and random trials haven't turned up anything yet. Thanks in advance for any help you can give me. Here is the page I currently have written to display data: (Toggle Plain Text) <html> <head> <title>Batter</title> </head> <body> <p><script language="JavaScript"><!-- function GetParam(param) { var start=location.search.indexOf("?"+param+"="); if (start<0) start=location.search.indexOf("&"+param+"="); if (start<0) return ' '; start += param.length+2; var end=location.search.indexOf("&",start)-1; if (end<0) end=location.search.length; var result=location.search.substring(start,end); var result=' '; for(var i=start;i<=end;i++) { var c=location.search.charAt(i); result=result+(c=='+'?' ':c); } return unescape(result); } var jsfile=' '; var jsfilesrc=' '; if (location.search!='') { document.write('This page was opened with the following data:<br>'); document.write('Param id = '); document.write(GetParam('id')); jsfile='p'+GetParam('id')+'Bat.js'; document.write('<br>JS File = '+jsfile); jsfilesrc='url/to/location/of/js/files'+jsfile; document.write('<br>jsfilesrc = '+jsfilesrc); } // --></script></p> <p> <script language="JavaScript" src=jsfilesrc><!-- //HERE'S WHERE I BELIEVE A FUNCTION NEEDS TO GO TO ACCESS DATA // --></script> </p> </body> </html> <html> <head> <title>Batter</title> </head> <body> <p><script language="JavaScript"><!-- function GetParam(param) { var start=location.search.indexOf("?"+param+"="); if (start<0) start=location.search.indexOf("&"+param+"="); if (start<0) return ' '; start += param.length+2; var end=location.search.indexOf("&",start)-1; if (end<0) end=location.search.length; var result=location.search.substring(start,end); var result=' '; for(var i=start;i<=end;i++) { var c=location.search.charAt(i); result=result+(c=='+'?' ':c); } return unescape(result); } var jsfile=' '; var jsfilesrc=' '; if (location.search!='') { document.write('This page was opened with the following data:<br>'); document.write('Param id = '); document.write(GetParam('id')); jsfile='p'+GetParam('id')+'Bat.js'; document.write('<br>JS File = '+jsfile); jsfilesrc='url/to/location/of/js/files'+jsfile; document.write('<br>jsfilesrc = '+jsfilesrc); } // --></script></p> <p> <script language="JavaScript" src=jsfilesrc><!-- //HERE'S WHERE I BELIEVE A FUNCTION NEEDS TO GO TO ACCESS DATA // --></script> </p> </body> </html>

Aug 24th, 2005, 3:06 PM	#5
glevine Newbie Join Date: Jun 2005 Posts: 22 Rep Power: 0	Both Page A and Page B are html files. Page B constructs the script filename out of the parameter passed from Page A and tries to output the data that is stored in that script file. Here is Page A: (Toggle Plain Text) <html> <head> <title>Find Player</title> </head> <body> <form action="batter.html#ReceivingAndDecoding"> <p>Enter id: <input type="text" size="20" name="id"> </p> </form> </form> </body> </html> <html> <head> <title>Find Player</title> </head> <body> <form action="batter.html#ReceivingAndDecoding"> <p>Enter id: <input type="text" size="20" name="id"> </p> </form> </form> </body> </html> And here is Page B (the same as in my first post): (Toggle Plain Text) <html> <head> <title>Batter</title> </head> <body> <p><script language="JavaScript"><!-- function GetParam(param) { var start=location.search.indexOf("?"+param+"="); if (start<0) start=location.search.indexOf("&"+param+"="); if (start<0) return ' '; start += param.length+2; var end=location.search.indexOf("&",start)-1; if (end<0) end=location.search.length; var result=location.search.substring(start,end); var result=' '; for(var i=start;i<=end;i++) { var c=location.search.charAt(i); result=result+(c=='+'?' ':c); } return unescape(result); } var jsfile=' '; var jsfilesrc=' '; if (location.search!='') { document.write('This page was opened with the following data:<br>'); document.write('Param id = '); document.write(GetParam('id')); jsfile='p'+GetParam('id')+'Bat.js'; document.write('<br>JS File = '+jsfile); jsfilesrc='url/to/location/of/js/files'+jsfile; document.write('<br>jsfilesrc = '+jsfilesrc); } // --></script></p> <p> <script language="JavaScript" src=jsfilesrc><!-- //HERE'S WHERE I BELIEVE A FUNCTION NEEDS TO GO TO ACCESS DATA // --></script> </p> </body> </html> <html> <head> <title>Batter</title> </head> <body> <p><script language="JavaScript"><!-- function GetParam(param) { var start=location.search.indexOf("?"+param+"="); if (start<0) start=location.search.indexOf("&"+param+"="); if (start<0) return ' '; start += param.length+2; var end=location.search.indexOf("&",start)-1; if (end<0) end=location.search.length; var result=location.search.substring(start,end); var result=' '; for(var i=start;i<=end;i++) { var c=location.search.charAt(i); result=result+(c=='+'?' ':c); } return unescape(result); } var jsfile=' '; var jsfilesrc=' '; if (location.search!='') { document.write('This page was opened with the following data:<br>'); document.write('Param id = '); document.write(GetParam('id')); jsfile='p'+GetParam('id')+'Bat.js'; document.write('<br>JS File = '+jsfile); jsfilesrc='url/to/location/of/js/files'+jsfile; document.write('<br>jsfilesrc = '+jsfilesrc); } // --></script></p> <p> <script language="JavaScript" src=jsfilesrc><!-- //HERE'S WHERE I BELIEVE A FUNCTION NEEDS TO GO TO ACCESS DATA // --></script> </p> </body> </html> And of course an simplified example of a javascript file that I will using (since there are a few thousand that could be used depending on the id given) is in my first post.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Aug 24th, 2005, 1:44 PM	#2
Cerulean Professional Programmer Join Date: Apr 2005 Location: London, England Posts: 459 Rep Power: 4	I'm still a little foggy on what needs to be done. Sounds like you want to have Page A, which has somewhere where you enter a number. Once you've done that, Page A will take the number and construct a filename, e.g user enters the number 3, and the script in Page A will make a filename of "somescript_3.js", for example. It will then request that script, and access a variable inside of it. Is that what you're trying to do? If so, which precise parts do you need help with.

Aug 24th, 2005, 2:26 PM	#3
glevine Newbie Join Date: Jun 2005 Posts: 22 Rep Power: 0	Yes cerulean, that is exactly what I was hoping to do, except that Page B is the page that constructs the file name, etc. I'm sure you meant that, but I wanted to clarify. The part I need help with is actually accessing/using the variable inside of the external script. I attempted to output rawBatting.length as an easy way to test that I could get something out of the script, but I ended up with no data being written to the page and IE said my page was written with errors. Of course the error it said existed was line 2 col 1, which is the beginning bracket of the html tag. So basically I need some assistance in taking the data from any variable in my ext js file and putting it on my webpage. Thanks.

Aug 24th, 2005, 4:19 PM	#6
Cerulean Professional Programmer Join Date: Apr 2005 Location: London, England Posts: 459 Rep Power: 4	Ah, okay then. I assume you can't just cut Page B out of it and do it all from Page A? That would make much more sense to me, and I could show you what needs to be done. It's the same process that you'd undertake using two pages, so yeah. There are a few ways you could go about doing this off the top of my head: The XmlHTTPRequest + eval way, and the DOM manipulation way. The first method constructs the correct filename then requests that page via XmlHTTPRequest, and calls eval on the received data. The second method uses DOM manipulation - it creates a new script element, sets it's src attribute, and then appends it to the body element or some such. Cross browser support I know is good for the first method (all recent browsers supporting XmlHTTPRequest), and i'd assume support for the second is good even though i've only ever tried it with Gecko and KHTML.

Aug 24th, 2005, 4:31 PM	#7
glevine Newbie Join Date: Jun 2005 Posts: 22 Rep Power: 0	I have no problems doing this with only one page. I only started with this method because I am new to web programming (strictly C/C++ and bits of Java in school without going much beyond the command-line spectrum) so I am still getting familiar with the best solutions for web projects like this. At the moment I only have to worry about myself and one other person using this page, so whichever method is easiest is just fine with me. As long as it works with Firefox or IE I am happy. Plus, I don't want to burden you too much. So, if you wouldn't mind showing me what needs to be done, I would really appreciate it. In the meantime I will be looking up references for both methods.

Aug 25th, 2005, 12:42 PM	#8
glevine Newbie Join Date: Jun 2005 Posts: 22 Rep Power: 0	Cerulean, or anyone for that matter, I was hoping I could get some help with using eval to parse the js file. I have used your suggestion to use XMLHttpRequest and I am able to receive a string containing all of the data in the file and to output it on the page. I have been trying to find good resources on how to use eval and how to parse strings in javascript, but I can't seem to find anything that has been helpful. And beyond that, is there a way to parse this response string so that it is possible have multidimensional arrays of 2-4 rows? I have some ideas, basically using the crap out substrings and the split function, but I was hoping someone might have a better way of doing this. Thanks again.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Programming Forums > Web Development and Design > JavaScript and Client-Side Browser Scripting

external js file stores data