Ajax Synchronous With Jquery. Is It Possible?

I put a sleep(5) in ajax.php page. I need the code returned to start another function group. It is also using ajax. My first ajax call looks like this: $.ajax({ url: '/ajax.php',

Solution 1:

Asynchronous code is best. Synchronous code can hang your browser, which makes it a bad idea in the case of ajax, where the speed of the ajax request depends on factors beyond the users computer and the browser. You don't want the users machine to hang, so avoid it. Instead try something like this.

functiona(passedData){
      return $.ajax({ 
          url : '/ajax.php',
          data : passedData
      });
 }

 functionb(passedData){
      return $.ajax({ 
          url : '/ajaxB.php',
          data : passedData
      });
 }

 $.when(a(data),b(data)).then(function(successDataForA,successDataForB){
     //Do code after all asynchronous ajax calls are done.//As a whole this is still asynchronous so other things can still run
 },function(failA,failB){
     //This fail callback is not necessary but here it is if needed
 });

Solution 2:

Use this

    $(document).ready(function () {

        $('#ajaxloading').hide()  // hide it initially
             .ajaxStart(function () {
                 $(this).show();
             })
             .ajaxStop(function () {
                 $(this).hide();
             });
    });

here "ajaxloading" is the Id of the DIV, which you want to display or hide. U can put any content inside this div

Solution 3:

If your loading image is gif image, then its hard to show it in IE and chrome, as these browsers stop any changes to DOM component while synchronous call and once the code is executed it shows all the changes. You can test it by putting an alert box just after you load an image.

$('#loading').dialog();
alert('loading image');

Once alert it popup, you can now see loading image in both IE and chrome as alert stop thread execution until a response is given by user.

Read this link: [https://stackoverflow.com/questions/11946828/loading-gif-image-is-not-showing-in-ie-and-chrome]

Solution 4:

I've had problems in the past getting IE to show a "loading..." message during an Ajax call even with an async call (which is what I'd certainly recommend you use), where the same code did work in FF.

The workaround that has worked for me with IE (and done no harm in FF) is to do something like this:

$('#loading').dialog();
setTimeout(function() {
    $.ajax(...);
},1);

That is, show the "loading" message then postpone the Ajax call by use of setTimeout() - this gives the browser a moment to redraw the page after the current JS finishes but before the timeout kicks in.

But of course if you're doing a synchronous request you presumably have additional code that you want to run after the $.ajax() method using its results, so you'd need to move all of that into the function you pass to setTimeout() (or call it from there, anyway).