SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    probably a simple javascript error (AJAX related but not really ajax!!)

    Hi,

    IM having a problem with my ajax script but im sure its javascript related ( im not too great with the dom at yet!)

    Heres the relevant code first:

    Code JavaScript:
    function send_message(msg) {
        var message_id = msg.id;
       	var updated = document.getElementById("textbox");
       	var updated_txt = updated.TextNode;
       	var url = "edit_message.php";
       	request.open("POST", url, true);
       	request.onreadystatechange = show_confirmation;
       	request.send("message_id=" + escape(message_id) +
                       "message=" + escape(updated_txt));
       }
     
       function show_confirmation() { 
       alert('hello');
        if(request.readyState == 4) {
         var confirmation = request.responseText;
         var div = document.getElementById("textbox");
       	 var confirmation_area = div.TextNode;
       	 replaceText(confirmation_area, confirmation);
     
        }
       }

    and then the whole file is below followed by the php script.....i know its a lot but im hoping it just a silly javascript error ive made. The request to the server in getmessage() and openmessage() works fine and the text gets put in the textarea but when i edit it and press submit nothing happens...i dont have a clue how to debug it....ive alerted inside the show_confirmation function and i get 4 hellos back ( 1 for each readystate)...if i could work out a way to see if the values are getting in to my php script it might help but i cant figure a way as the ajax kinda by passes it all. Nothing in the db gets updated.

    Any ideas? If someone could even suggest a good way to debug or a way to see if the values are even getting to my php script ( as i say that alert works but i dont know if thats a sign its working or not)

    Code JavaScript:
    <html>
      <head>
      <title>test page</title>
      <script type="text/javascript" src="text-utils.js"></script>
      <script language="javascript" type="text/javascript">
     
     
      var request = null;
     
      function createRequest() {
        try {
          request = new XMLHttpRequest();
        } 
        catch (trymicrosoft) {
          try {
            request = new ActiveXObject("Msxml2.XMLHTTP");
          } catch (othermicrosoft) {
          try {
            request = new ActiveXObject("Microsoft.XMLHTTP");
          } 
          catch (failed) {
          request = null;
          }
          }
        }
     
     
         if (request == null)
           alert("Error creating request object!");
       }
     
       function get_message(msg) {
        var message_id = msg.id;
        createRequest();
        var url = "edit_message.php?message_id=" + escape(message_id);
        request.open("GET", url, true);
        request.onreadystatechange = open_message;
        request.send(null);
     
       }
     
       function open_message() {
        if(request.readyState == 4) {
         var message_txt = request.responseText;
         var message_area = document.getElementById("textbox");
         replaceText(message_area, message_txt);
     
        }
       }
     
       function send_message(msg) {
        var message_id = msg.id;
       	var updated = document.getElementById("textbox");
       	var updated_txt = updated.TextNode;
       	var url = "edit_message.php";
       	request.open("POST", url, true);
       	request.onreadystatechange = show_confirmation;
       	request.send("message_id=" + escape(message_id) +
                       "message=" + escape(updated_txt));
       }
     
       function show_confirmation() { 
       alert('polo');
        if(request.readyState == 4) {
         var confirmation = request.responseText;
         var div = document.getElementById("textbox");
       	 var confirmation_area = div.TextNode;
       	 replaceText(confirmation_area, confirmation);
     
        }
       }
     
     
     
     
      </script>
    </head>
    <body>
    <h1 style="margin-top: 30px;">Requesting using AJAX</h1>
     <table style="float: left; width: 30px;">
    <?php
    require_once('../mysql_connect.php');
    $sql = "SELECT * FROM message ORDER BY message_id";
    $query = mysql_query($sql);
    while($row = mysql_fetch_assoc($query)) {
      $message = $row['message'];
      $author = $row['author'];
      $message_id = $row['message_id'];
      ?>
     
        <tr>
          <td><?php echo substr($message, 0, 30); ?></td><td><span style="color: red; font-weight: bold;"><?php echo $author; ?></span></td><td>
          <form>
     
          <input type="button" id="<?php echo $message_id; ?>" value="edit" onClick="get_message(this);" /></td>     </tr>
     
     
     
     
      <?php
     
    }
     
    ?>
      </table>
     <textarea style="width: 300px; height: 400px; border: 1px solid #ccc; margin-left: 20px;" id="textbox"></textarea>
      <input type="button" id="<?php echo $message_id; ?>" value="submit" onClick="send_message(this);" /></form>
     
     
        </div>
     
     
    </body>
    </html>

  2. #2
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok so ive uncovered a problem...when alerting back the variables in my send_message() function the message_id is getting populated fine but the updated_txt one just says undefined when i alert it back. This is probably the problemo but i dont know how to access the text in that textarea any other way...it looks ok to me but as i say im kinda new to the DOM


    Ive also checked in my javascript console and i dont have any errors

    any ideas?


  3. #3
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok it was an ajax problemo afterall! I needed a http header in there to let the server know the data was in the $_POST.....it mkaes my function look like this:

    Code JavaScript:
    function send_message(msg) {
        var message_id = msg.id;
        var updated = document.getElementById("textbox");
        var updated_txt = updated.TextNode;
        var url = "edit_message.php";
        request.open("POST", url, true);
        request.onreadystatechange = show_confirmation;
       AJAX.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        request.send("message_id=" + escape(message_id) +
                       "message=" + escape(updated_txt));
       }
    Last edited by elduderino; Jun 14, 2007 at 12:04.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •