467,168 Members | 970 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,168 developers. It's quick & easy.

Beginner: Javascript function call within URL from use of XMLHTTPRequest

The title probably isn't very clear, but I haven't been able to find this problem (or I must be having problems figuring out which search strings to use) so I apologize if this has been addressed before, and I apologize if this is the wrong forum since I'm trying to use the XMLHTTPRequest with Javascript and PHP and I couldn't figure out which category my problem belonged to.

I am completely new to AJAX and rusty with Javascript. I created a XMLHTTPRequest object on "index.php" that calls to another page 'programs.php' that queries and outputs music information for a skating program.

In the output of 'programs.php' it contains:

index.php:
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript" language="Javascript">
  2. <!--
  3.  var req = false;
  4.    try {
  5.      req = new XMLHttpRequest();
  6.    } catch (trymicrosoft) {
  7.      try {
  8.        req = new ActiveXObject("Msxml2.XMLHTTP");
  9.      } catch (othermicrosoft) {
  10.        try {
  11.          req = new ActiveXObject("Microsoft.XMLHTTP");
  12.        } catch (failed) {
  13.          req = false;
  14.        }  
  15.      }
  16.    }
  17.  
  18.    if (!req)
  19.      alert("Error initializing XMLHttpRequest!");
  20.  
  21. function sendRequest(id, program) {
  22.   req.open('get', 'programs?id=' + id + '&x=' + program);
  23.   req.onreadystatechange = handleResponse;
  24.   req.send(null);
  25. }
  26.  
  27. function handleResponse() {
  28.  
  29.   if(req.readyState == 4){
  30.     var response = req.responseText;
  31.     var update = new Array();
  32.  
  33.     if(response.indexOf('||' != -1)) {
  34.       update = response.split('||');
  35.       document.getElementById(update[0]).innerHTML = update[1];
  36.     }
  37.   }
  38.   else
  39.   alert("loading" + ajax.readyState);
  40. }
  41.  
  42. -->
  43. </script>
  44.  
  45. </head>
  46.  
  47. <body>
  48.  
  49. <a href="javascript:sendRequest('show_music', '<? echo $x ?>');">Music</a> |
  50. <div id="info">
  51.  
  52. </div>
  53.  
  54. </body>
  55. </html>
  56.  
programs.php:
Expand|Select|Wrap|Line Numbers
  1.  
  2. switch($_REQUEST['id']) {
  3.  
  4. case 'show_music':
  5.          echo "info||";
  6.          $program = $_REQUEST['x'];
  7.          query_music_song($program, $db);
  8.          mysql_close();
  9.          break;
  10. }
  11.  
  12. <script language="JavaScript">
  13.  
  14. function show(click_lyrics) {
  15.     if (click_lyrics.style.display == "none") {
  16.         click_lyrics.style.display = "";
  17.     } else if (click_lyrics.style.display == "") {
  18.         click_lyrics.style.display = "none";
  19.     }
  20. }
  21.  
  22. </script>
  23. ...
  24. <snip>
  25. ...
  26. echo "<a href=\"#\" onclick=\"show(lyrics)\">Show Lyrics</a><br />";
  27. echo "<span id=\"lyrics\" style=\"display:none\"><pre>" . $m->lyrics . "</pre></span>";
  28.  
  29.  
This is in addition to the use of php to query and output code that I took out.

My problem is that the function call to show(click_lyrics) does not seem to work, which I suppose is to be expected. So my question is whether there is a way to make this work in hiding the lyrics or show the lyrics within the requested data? Or perhaps a better way to code this? Let me know if more code/explanation is needed for clarity.

Thanks much in advance.
Oct 24 '06 #1
  • viewed: 6988
Share:
1 Reply
acoder
Expert Mod 8TB
To run JavaScript returned from an Ajax request, you either have to eval it, or better still, add the script to the head of the main page:
Expand|Select|Wrap|Line Numbers
  1. var script = document.createElement("script");
  2. script.appendChild(document.createTextNode(code)); //code is a line of code
  3. var head = document.getElementsByTagName("head")[0];
  4. head.appendChild(script);
May 25 '08 #2

Post your reply

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

By using this site, you agree to our Privacy Policy and Terms of Use.