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 4 of 4
  1. #1
    Regular Coder
    Join Date
    Sep 2010
    Posts
    460
    Thanks
    214
    Thanked 1 Time in 1 Post

    Second Ajax Call not working

    Hi,

    I have webpage 1 which when a button is clicked calls up an ajax script, this ajax script also has a button that when clicked should call a second ajax script. The first part works fine, the second does not work at all.

    I am slightly confused as to where I should have my second ajax function. Should I have it in the head of webpage 1 or in the head of the first ajax script called. I have tried both ways and neither works.

    Here is the script:
    Webpage 1:
    Code:
    <head>
    <script type="text/javascript">
    function loadXMLDoc(){
    if (window.XMLHttpRequest)  {
      xmlhttp=new XMLHttpRequest();
      }
    else {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function(){
      if (xmlhttp.readyState==4 && xmlhttp.status==200){
        document.getElementById("show1").innerHTML=xmlhttp.responseText;
        }
      }
    
    xmlhttp.open("POST","getAjax1.php",true);
    xmlhttp.send();
    }
    
    </script>
    <script type="text/javascript">
    function loadXMLDOC2(){
    if (window.XMLHttpRequest)  {
      xmlhttp=new XMLHttpRequest();
      }
    else {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function(){
      if (xmlhttp.readyState==4 && xmlhttp.status==200){
        document.getElementById("show2").innerHTML=xmlhttp.responseText;
        }
      }
    
    xmlhttp.open("POST","getAjax2.php",true);
    xmlhttp.send();
    }
    
    </script>
    <head>
    <body>
    
    <?php
    	$con = mysql_connect("localhost","user","password");
    				if (!$con)
    					{
    					die('Could not connect: ' . mysql_error());
    					}
    				mysql_select_db("mydb", $con);
    
    				$result = mysql_query("SELECT * FROM table1
    				WHERE title ='Mytitle' ORDER BY Date, Time DESC LIMIT 15");
    
    				echo "<table id='new' width='100%'>
    				<tr>";
    
    				while($row = mysql_fetch_array($result))
    					{
    					echo "<td><input type='button' class='button5' name='subject' value='" . $row[subject] . "'  onclick='loadXMLDoc()'></td>";
    					echo "</tr>";
    					}
    				echo "</table>";
    
    				mysql_close($con);
    ?>
    	<br />
    
    
    			<div id="show1"></div>
    </body>
    </html>
    Here is the first ajax script/ getAjax1.php:
    Code:
    <head>
    </head>
    <body>
    <div class="standard">
    <?php
    $con = mysql_connect("localhost","user","password");
    				if (!$con)
    					{
    					die('Could not connect: ' . mysql_error());
    					}
    				mysql_select_db("mydb", $con);
    
    				$result = mysql_query("SELECT * FROM table1
    				WHERE title ='MyTitle' ORDER BY Date, Time DESC LIMIT 1");
    
    				echo "<table id='new' width='100%'>";
    
    				while($row = mysql_fetch_array($result))
    					{
    					echo "<tr>";
    					echo "<th colspan='2'>" . $row[subject] . "</th>";
    					echo "</tr><tr>";
    					echo "<td colspan='2'><br />" . $row[message] . "<br /></td>";					echo "</tr>";
    					}
    				echo "</table>";
    
    				mysql_close($con);
    
    ?>
    <br />
    <br />
    <input type="button" class="button4" name="comment" value="Add a Comment" onclick="loadXMLDoc2()" />
    <br />
    <br />
    	<div id="show2">&nbsp</div>
    <br />
    <br />
    </div>
    </body>
    </html>
    I am also not sure if I can call this function anything I like or if it has to be a variant of loadXMLDoc?
    Help would be great ...

  • #2
    Regular Coder
    Join Date
    May 2009
    Posts
    425
    Thanks
    3
    Thanked 62 Times in 61 Posts
    First, you should make a more flexible AJAX function like so:
    PHP Code:
    function loadXMLDoc(FileID){
    if (
    window.XMLHttpRequest)  {
      
    xmlhttp=new XMLHttpRequest();
      }
    else {
      
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function(){
      if (
    xmlhttp.readyState==&& xmlhttp.status==200){
        
    document.getElementById(ID).innerHTML=xmlhttp.responseText;
        }
      }

    xmlhttp.open("POST",File,true);
    xmlhttp.send();

    Usage:
    PHP Code:
    onclick="loadXMLDoc('getAjax1.php', 'show1');" 
    And as for the file(s) that you open with ajax, just treat them as if they are the HTML inside of the div you're assigning it to (hence, innerHTML)... i.e., you don't need <head>, <body>, etc. tags. So your file "getAjax1.php" would look something like this:
    PHP Code:
    <div class="standard">
    <?php
    $con 
    mysql_connect("localhost","user","password");
                    if (!
    $con)
                        {
                        die(
    'Could not connect: ' mysql_error());
                        }
                    
    mysql_select_db("mydb"$con);

                    
    $result mysql_query("SELECT * FROM table1
                    WHERE title ='MyTitle' ORDER BY Date, Time DESC LIMIT 1"
    );

                    echo 
    "<table id='new' width='100%'>";

                    while(
    $row mysql_fetch_array($result))
                        {
                        echo 
    "<tr>";
                        echo 
    "<th colspan='2'>" $row[subject] . "</th>";
                        echo 
    "</tr><tr>";
                        echo 
    "<td colspan='2'><br />" $row[message] . "<br /></td>";                    echo "</tr>";
                        }
                    echo 
    "</table>";

                    
    mysql_close($con);

    ?>
    <br />
    <br />
    <input type="button" class="button4" name="comment" value="Add a Comment" onclick="loadXMLDoc('getAjax2.php', 'show2');" />
    <br />
    <br />
        <div id="show2">&nbsp</div>
    <br />
    <br />
    </div>
    (The <div class="standard"> portion of the code may be redundant but it depends on if you plan on having different classes for the div for different files.)

  • Users who have thanked tfburges for this post:

    Jenny Dithe (09-30-2010)

  • #3
    Regular Coder
    Join Date
    Sep 2010
    Posts
    460
    Thanks
    214
    Thanked 1 Time in 1 Post
    Thank you that helps a lot and I can see how that simplifies things, the only problem I am having is that it doesn't call the file and I get an error warning File is not Defined. I tried playing around with this and using variables, etc, but that didn't work.

    I can see that it is almost there, but can't quite see the missing piece of the puzzle.

  • #4
    Regular Coder
    Join Date
    Sep 2010
    Posts
    460
    Thanks
    214
    Thanked 1 Time in 1 Post
    My mistake, a typo when copying. It works great. Thanks.


  •  

    Posting Permissions

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