By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,709 Members | 2,157 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,709 IT Pros & Developers. It's quick & easy.

Undefined global array inside body tag

P: 6
Greetings,

My first time on this forum. I hope someone can help me out.
I am trying to get 11 values from several different identically structured webpages. I have the list of webpages saved as a global array. I am trying to access the sites one at a time and acquire the data using a for loop saving each value into an array that was declared as a global variable. I am trying to access the site from Body of the html and place each value into a row of a table and then empty the array with the values and start the for loop over accessing the next site.
I tested to see that the page is being read properly and that the value array has the correct data in it. As far as I can tell that all works fine. However when trying to write it to my table it comes out as a table full of the word "undefined."

I hope this is all clear. I removed some of the specifics from the code for privacy reasons. Any advice is appreciated.

Thanks

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <title>HTML searching</title><head>
  3. <script type="text/javascript" language="javascript">
  4.  
  5.   var sites = new Array("http://site1.com",http://site2.com","http://site3.com","http://site4.com");
  6.   var value = new Array();
  7.   var http_request = false;
  8.  
  9.   function makeRequest(url, parameters) {
  10.  
  11.    try {
  12.     netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
  13.    } catch (e) {
  14.     alert("Permission UniversalBrowserRead denied.");
  15.    }
  16.  
  17.     http_request = false;
  18.     http_request = new XMLHttpRequest();
  19.     if (http_request.overrideMimeType) {
  20.       http_request.overrideMimeType('text/xml');
  21.     }
  22.     if (!http_request) {
  23.       alert('Cannot create XMLHTTP instance');
  24.       return false;
  25.     }
  26.     http_request.onreadystatechange = alertContents;
  27.     http_request.open('GET', url + parameters, true);
  28.     http_request.send(null);
  29.   }
  30.  
  31.   function alertContents() {
  32.     if (http_request.readyState == 4) {
  33.       if (http_request.status == 200) {
  34.  
  35.         var the_page = http_request.responseText;
  36.     //... do some things to parse through the html
  37.     for(var i=0; i<11; i++)
  38.     {
  39.       //parse through data to save 11 values
  40.       value[value.length]=parsedString;
  41.     }
  42.       //alert("TESTING " + value);
  43.       } else {
  44.         alert('There was a problem with the request.');
  45.       }
  46.     }
  47.   }
  48.  
  49. </script>
  50. </head>
  51. <body>
  52.  
  53. <table border=1>
  54.  <tr>
  55. <script>
  56.  
  57.     for(var i=0; i<4; i++)
  58.     {
  59.         makeRequest(sites[i], '');
  60.         for(var j=0; j<11; j++)
  61.           {
  62.           document.write('<td>'+value[j]+'</td>');
  63.         }
  64.  
  65.        document.write('</tr><tr>');
  66.     }
  67.     value.length=0;
  68. </script>
  69. </body>
  70.  
  71. </html>
  72.  
  73.  
Jan 20 '08 #1
Share this Question
Share on Google+
10 Replies


gits
Expert Mod 5K+
P: 5,328
hi ...

since the ajax-call is async you don't have the retrieved values in your array right after initializing the call ... so you should write it from your alertContent method, that is called when the response is ready to use. you should note that with your current code the alert comes after your document.write?

kind regards
Jan 20 '08 #2

P: 6
Thank you for your response.

If I put the block of code I have inside the body tag into my alertContents function would I be calling makeRequest recursively? Would one makeRequest function call end before the next got put onto the stack(if that's the correct term)? This seems like it might be slow or memory inefficient if that is what would really happen.

I would also have to initiate this by calling the function the first time somewhere outside.

I hope I am understanding you correctly.
Jan 21 '08 #3

gits
Expert Mod 5K+
P: 5,328
nope ... it doesnt't call recursivly then ... you only have to assure that you got the response before you want to use it! ... so in your case you fill the values array ... but now you would need a mechanism that invokes the document-update function when you have all your values ready or you could (and probably should) avoid document-write and update the innerHTML everytime a response returns ... there is nothing memory-inefficient with that ... it is just an async call and we have to deal with the async data-flow:

when you send a XMLHttpRequest you tell it that onreadystatechange is something to do and usually when the readystate is 4 and the request-status is 200 you have the moment where you have your response. you have to chain that moments with your code in a way that you can rely on the response ... you shouldn't use timeouts or whatever to wait for something ... since we always know when the response is back :) ... another way would be to make a sync call ... but that is ugly and you loose nearly all advantages of ajax ...

kind regards
Jan 21 '08 #4

P: 6
thanks for the help so far.

I implemented an 'updating' function and using innerHTML as you suggested. My only problem now is that my table does not show up properly. The function is just a for loop that looks like this:
Expand|Select|Wrap|Line Numbers
  1. function updatePage() { 
  2.   for(var i=0; i<11;i++) {
  3.     document.body.innerHTML += "<td>"+value[i]+"</td>";
  4.   }
  5.   document.body.innerHTML += "</tr><tr>";
  6. }
Something obvious that is wrong here? The line of data from the array appears properly with no spaces or anything but appears to be unaffected by the col tags.
edit: I realized I am assuming that "innerHTML+=" appends to the bottom of the body tag. Is that a false assumption? The data is appearing underneath my table headers
Jan 21 '08 #5

gits
Expert Mod 5K+
P: 5,328
innerHTML sets the inner HTML code of the node(tag) you specify ... so you should add it to your table ...

kind regards

ps: alternativly you could use the createElement() and appendChild() dom-methods ...
Jan 21 '08 #6

P: 6
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <title>HTML searching</title><head>
  3. <script type="text/javascript" language="javascript">
  4.  
  5.   var sites = new Array("http://site1.com",http://site2.com","http://site3.com","http://site4.com");
  6.   var value = new Array();
  7.   var http_request = false;
  8.  
  9.   function makeRequest(url, parameters) {
  10.  
  11.    try {
  12.     netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
  13.    } catch (e) {
  14.     alert("Permission UniversalBrowserRead denied.");
  15.    }
  16.  
  17.     http_request = false;
  18.     http_request = new XMLHttpRequest();
  19.     if (http_request.overrideMimeType) {
  20.       http_request.overrideMimeType('text/xml');
  21.     }
  22.     if (!http_request) {
  23.       alert('Cannot create XMLHTTP instance');
  24.       return false;
  25.     }
  26.     http_request.onreadystatechange = alertContents;
  27.     http_request.open('GET', url + parameters, true);
  28.     http_request.send(null);
  29.   }
  30.  
  31.   function alertContents() {
  32.     if (http_request.readyState == 4) {
  33.       if (http_request.status == 200) {
  34.  
  35.         var the_page = http_request.responseText;
  36.     //... do some things to parse through the html
  37.     for(var i=0; i<11; i++)
  38.     {
  39.       //parse through data to save 11 values
  40.       value[value.length]=parsedString;
  41.     }
  42.       //alert("TESTING " + value);
  43.       updatePage();
  44.       } else {
  45.         alert('There was a problem with the request.');
  46.       }
  47.     }
  48.   }
  49.  
  50.  function updatePage() {
  51.   for(var j=0; j<11; j++)
  52.   {
  53.     document.body.innerHTML += '<td>' + value[j] + '</td>';
  54.   }
  55.   document.body.innerHTML += '</tr><tr>';
  56. }
  57. </script>
  58. </head>
  59. <body>
  60.  
  61. <table border=1>
  62.  <tr>
  63.  <th>Header 1</th>
  64.  <th>Header 2</th>
  65.   ....
  66.  <th>Header 11</th>
  67.  </tr>
  68.  <tr>
  69. <script>
  70. /*
  71.     for(var i=0; i<4; i++)
  72.     {
  73.         makeRequest(sites[i], '');
  74.     }
  75. */
  76. makeRequest(sites[0]);
  77. </script>
  78. </body>
  79.  
  80. </html>
  81.  
  82.  

Here is the code as it has changed. Just to keep things clear. I am assuming it would put the col tags right under the row tag but that is not what seems to be happening. I had everything on the page print out inside <xmp> so that I could see the tags.

The headers come out fine but after makeRequest is called the are changed to look like this:

&lt;table border=1&gt;&lt;tr&gt;&lt;td&gt;

and then under that comes out my innerHTML stuff as

<td>value 1</td><td>value 2</td> .... <td>value 11</td></tr><tr>

and it looks fine. Do you know if that has anything to do with it? I will look into those alternatives you mentioned.

Many thanks
edit: My for loop is commented out and I am only calling it once to test it with only one of the site before I try reading it from all of them. Just to clarify.
Jan 21 '08 #7

P: 6
I woke up today and decided to try to run the for loop that will read each of several web pages one after another (so I assume). I figured even if the table isn't working properly its no big deal. Just wanted to see it print out all the data.

It is only printing out the values from the last site. So if I run makeRequest passing it site[0] it gives me those 11 values if I run the for loop trying to get site1 thru site4 then it gives me just the 11 values for site4. I was thinking this might have something more to do with it being asynchronous again. Any thoughts?

Thanks
Jan 21 '08 #8

acoder
Expert Mod 15k+
P: 16,027
The reason why you only get the results for the last request is that you're re-using http_request each time, so effectively you've only made one request - the last one.
Jan 23 '08 #9

P: 6
Is there a way to do multiple page requests that you would suggest?
Jan 30 '08 #10

acoder
Expert Mod 15k+
P: 16,027
Don't use the global variable. Use a local one, but then you'd probably have to make alertContents into an anonymous function so that the variable is accessible within it.
Jan 30 '08 #11

Post your reply

Sign in to post your reply or Sign up for a free account.