Question

       var hasData = '1';
        while (hasData != 0) {
            $.ajax({
            url: '/ajax.php?updateRow='+hasData,
            dataType: 'json',
            async: false,
            success: function(data) {
                hasData = data.next;
                $('.result').append(data.html);
              }
            });

What should happen:
JSON Array pulled from PHP ( [html] and [next] ). If [next] is set to 0 (when there are no more entries) – the while loop stops and that should be it.

What happends:
Everything that should, except – when the while() requirement is met (so when hasData is set to 0) – the loop enters into an infinite loop (and it keeps requesting the last entry, forever…until the script becomes “unresponsive”)

Answer 1

ajax sends a request and executes the callback when there is a response. So what’s happening is:

• fire a request
• fire another request
• fire another request
• fire another request
• …

because it’s inside a while loop. You’re clogging your script up with requests, and the server gets a bunch of requests which it probably cannot handle.

Edit: I’m sorry, I missed async: false. However that always makes the browser irresponsive. The best thing to do would be using async: true and fire another if the conditional says so, but only after you get the response:

function check() {
        $.ajax({
        url: '/ajax.php?updateRow='+hasData,
        dataType: 'json',
        async: true,
        success: function(data) {
            hasData = data.next;
            $('.result').append(data.html);
            if(hasData != 0) check(); // do it again
          }
        });
}

check(); // fire the first request

As Spycho pointed out, since you’re fetching JSON, a more convenient way might be:

(function() {

    var fireRequest = function() { // this function is not available anywhere else,
                                   // to avoid having this process running more than once

        $.getJSON('/ajax.php', {updateRow: hasData}, function(data) {
            hasData = data.next;
            $('.result').append(data.html);
            if(hasData != 0) fireRequest(); // do it again
        });

    };

    fireRequest(); // start the process

})(); // call it