Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder LearningCoder's Avatar
    Join Date
    Jan 2011
    Location
    The Pleiades
    Posts
    922
    Thanks
    76
    Thanked 29 Times in 29 Posts

    Exclamation Slight issues with my Ajax call

    Hi, I have an Ajax script which I have modified to suit my needs...nearly.

    I have 2 links:
    Code:
    <a href="#" name="ASC" onmouseup="showUser('ASC')">ASC</a>|
    <a href="#" name="DESC" onmouseup="showUser('DESC')">DESC</a>
    as you can see when they are clicked they go into this ajax function:
    Code:
    <script type="text/javascript">
       function showUser(order)
     {
     if (order=="")
       {
       document.getElementById("content").innerHTML=xmlhttp.responseText;
       } 
     if (window.XMLHttpRequest)
       {// code for IE7+, Firefox, Chrome, Opera, Safari
       xmlhttp=new XMLHttpRequest();
       }
     else
       {// code for IE6, IE5
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
       }
     xmlhttp.onreadystatechange=function()
       {
       if (xmlhttp.readyState==4 && xmlhttp.status==200)
         {
         document.getElementById("content").innerHTML = xmlhttp.responseText;
         }
       }
     xmlhttp.open("GET","sort.php?q="+order,true);
     xmlhttp.send();
     }
     </script>
    This goes into my db when it is called and re-arranges the list by what they choose, either ascending or descending. If the function hasn't run, it displays the list by member number (this is set in my sort.php).

    Here is my sort.php:
    PHP Code:
    <?php
    require("connectdb.php");

    if(empty(
    $_GET['q'])){

      
    $sql mysql_query("SELECT * FROM members");
      
      echo 
    "<table id='members_table' name='members_table'>
            <tr>
               <th>Member No.</th>
               <th>Username</th>
               <th>Join Date</th> 
            </tr>"
    ;

      while(
    $row mysql_fetch_array($sql)){
        echo 
    "<tr>";
        echo 
    "<td>" $row['id'] . "</td>";
        echo 
    "<td>" $row['username'] . "</td>";
        echo 
    "<td>" $row['join_date'] . "</td>";
        echo 
    "</tr>";
      }
      echo 
    "</table>";

      
    }
    else{
       
    $q $_GET['q'];
       
    $sqlmysql_query("SELECT * FROM members ORDER BY username {$q}");

       echo 
    "<table id='members_table' name='members_table'>
             <tr>
                <th>Member No.</th>
                <th>Username</th>
                <th>Join Date</th> 
             </tr>"
    ;

       while(
    $row mysql_fetch_array($sql)){
          echo 
    "<tr>";
          echo 
    "<td>" $row['id'] . "</td>";
          echo 
    "<td>" $row['username'] . "</td>";
          echo 
    "<td>" $row['join_date'] . "</td>";
          echo 
    "</tr>";
       }
       echo 
    "</table>";
    }

    mysql_close($con);
    ?>
    Problem is, when I click on either the ASC or DESC links, they go into the correct order, but both of the links disappear.

    Can anyone help me to fix this problem please!?

    Thanks you in advance.

    Regards,

    LC.
    Last edited by LearningCoder; 09-15-2012 at 03:03 PM.

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,899
    Thanks
    56
    Thanked 542 Times in 539 Posts
    you wouldn't happen to have your links inside your "content" div by any chance...?

  • #3
    Regular Coder LearningCoder's Avatar
    Join Date
    Jan 2011
    Location
    The Pleiades
    Posts
    922
    Thanks
    76
    Thanked 29 Times in 29 Posts
    I do indeed.

    I thought it was something to do with the innerHTML statement, so I tried doing:
    Code:
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
         {
         document.getElementById("content").innerHTML += xmlhttp.responseText;
         }
    by adding the + to the = sign, I presumed it would append to the content div. But it re-writes another table if I click the ASC or DESC links. This happens because everytime the ajax is called, my php file writes a new table each time so obviously what I did was wrong. I've got the functionality, if I click ASC it orders them alphabetically and if I click DESC, it reverses the data results, the only issue is with the links disappearing.

    If I can sort that out I've pretty much solved my problem.

    How can I fix this?

    Regards,

    LC.
    Last edited by LearningCoder; 09-15-2012 at 10:02 AM. Reason: added information.

  • #4
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,899
    Thanks
    56
    Thanked 542 Times in 539 Posts
    take your links out of your content div?

  • #5
    Regular Coder LearningCoder's Avatar
    Join Date
    Jan 2011
    Location
    The Pleiades
    Posts
    922
    Thanks
    76
    Thanked 29 Times in 29 Posts
    Ah thank you.

    I placed the table in it's own separate div and then wrote the innerHTML to that element.

    Kind Regards,

    LC.

  • #6
    Regular Coder LearningCoder's Avatar
    Join Date
    Jan 2011
    Location
    The Pleiades
    Posts
    922
    Thanks
    76
    Thanked 29 Times in 29 Posts
    Is there anyway to append to a table? I have created my table and table headers in HTML:
    Code:
    <table id="members_table">
    	  <tr>
    	      <th>Member No.</th>
    	      <th><a href="#" onmouseup="showUser('ASC','username')">Username</a></th>
    	      <th><a href="#" onmouseup="showUser('ASC','join_date')">Join Date</th>
    	  </tr>
    In my php script, I echo each database row into its own table row.

    Everytime I click my links, the table headers disappear and it's something to do with writing the innerHTML to the same parent element. How can I fix this problem? I've changed my code many times and haven't found a solution yet.

    Regards,

    LC.


  •  

    Posting Permissions

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