titans
titans

Reputation: 451

How stop post query

I wrote example on JQuery and php. Jquery has inserted post query. As result, the page must view 9 line. Code on JQuery+HTML:

<script type="text/javascript">

$(document).ready(function(){
$.post("test.php", {'test': "test"},
function (result) {
    for (var i = 0; i < result; i++) {
         $.post("test.php", {'test': "test2"},
            function (result2) {
                for (var j = 0; j < result2; j++) {
                    $("#test").append("<p>i="+i+" , j= "+j+" </p>");                    
                }
            }
         );
      }
  }
 );
});

</script>
<div id="test"></div>

The test.php has next code:

<?php
$id=$_POST["test"];
echo '3';
?>

I have next result:

i=3 , j= 0
i=3 , j= 1
i=3 , j= 2
i=3 , j= 0
i=3 , j= 1
i=3 , j= 2
i=3 , j= 0
i=3 , j= 1
i=3 , j= 2 

Why i=3? How this fix? I need like this:

i=0 , j= 0
i=0 , j= 1
i=0 , j= 2
i=1 , j= 0
i=1 , j= 1
i=1 , j= 2
i=2 , j= 0
i=2 , j= 1
i=2 , j= 2

Upvotes: 1

Views: 90

Answers (2)

ioums
ioums

Reputation: 1395

As Marc B points out the AJAX calls are asynchronous. If you want to can disable this behaviour by using the async option for jQuery's ajax() (though the solution of passing the value of i in the POST is probably better)

$.ajax({
    type: "POST",
    url: "test.php", 
    async: false,
    data: {test: "test"}
}).done( function (result) {
    for (var i = 0; i < result; i++) {
         $.ajax({
             type: "POST",
             url: "test.php",
             async: false,
             data: {test: "test2"}
         }).done(function (result2) {
             for (var j = 0; j < result2; j++) {
                 $("#test").append("<p>i="+i+" , j= "+j+" </p>");                    
             }
         });
     }
});

Upvotes: 0

Marc B
Marc B

Reputation: 360712

Remember that AJAX calls are asynchronous. You're using your i loop to fire off those requests, but the javascript code is almost guaranteed to be running/finishing FASTER than the ajax requests (which is just a normal http request, remember) can go to the server and come back. By the time they DO come back, your i loop has finished and i will have the last value assigned within the loop. That happens to be 3 in your case.

If you were doing this for a much LONGER loop, you might luck out and have some responses come back while that i loop is still executing, in which case you might see different value for the output appear somewhere.

To answer your actual question, you'd need to send i along with the rest of the ajax request, so you can figure out which request you're getting an answer from. Remember that each .post() call is going to be a seperate HTTP request, and there is no guarantee that you'll get the answers back in the same order that you'd originally requested them. Some requests might get hit by net.lag, or take a different route and end up coming back after later requests, so change your code to be:

     $.post("test.php", {'test': "test2", i: i},

and then return that i along with the answer:

<?php
   $test = $_POST['test'];
   $i = $_POST['i'];
   echo "$i 3";

Upvotes: 4

Related Questions