Ajax beforeSend issue only on chrome browser when async: false

Question

I made one small ajax function which returns json object received from server, I checked this function on firefox, operamini, works fine and during posting data to server I am able to see spinner image, but incase of google chrome I can't see spinner while posting, when async is false, if I make async : true, I can see spinner.

Can someone tell me solution for same, all functions in my script are working fine, except spinner only on chrome.

Any more things I can add to show spinner for chrome to existing function ? The only way left for me is to modify the function, because this function is called in many other functions in my script which is very long too.. I will be happy if anyone can provide me alternate solution.

Chrome : Version 28.0.1500.71 Ubuntu 12.04 (28.0.1500.71-0ubuntu1.12.04.1)

jQuery v2.1.3

This is my function

function _get_data(options) {
      var result={};
      $.ajax({
              url   : options.url,
              async : false,  
              cache : false,
              data  : options.data,
          beforeSend: function() {
                       $(options.before.element).html(options.before.html);
              },
             method : "POST",
           dataType : "json",
             success:function(data) {
                       result = data; 
              }
            });
     return result;
  }

This is how I call it

  var my_data = _get_data({ 
                url    :'http://dba.org/test',
                before : { 
                        element : "#loading", 
                        html    : '<img class="loader" src="data:image/png;base64,iVBORw0KGgoAAAANSUhE ... somemore"/>' 
                     },
                data   : { firefox : true, chrome : false } 
            });

If anyone here got solution already please share

Thanks in advance,

Wish You Happy New Year In Advance..

I'm surprised it works on the other browsers. There shouldn't be any rendering while a synchronous function is running. — Barmar, Dec 29 '14 at 12:38
Maybe if you make the ajax call after DOM ready in chrome it can work — ppascualv, Dec 29 '14 at 12:56
@Barmar : As soon as I click on my navigation menu, I can see loader in some div ( firefox ), but till ajax success, I can't click / select any other option this means its sync right ? yes, but don't know why I can't see spinner incase of chrome... — user3637224, Dec 29 '14 at 12:58
Because Chrome doesn't let the renderer run until all Javascript finishes. — Barmar, Dec 29 '14 at 12:59
@Barmar : any async solution ? @pabillitoo : is it like this --> `$(document).ready(function(){ });` ? if so I am already using like this — user3637224, Dec 29 '14 at 13:02
If you do it async there shouldn't be a problem. You should avoid using synchronous AJAX. — Barmar, Dec 29 '14 at 13:03
@Barmar: Sir My script is too long.. even all functions works fine on chrome except this beforeSend spinner.. please help me.. — user3637224, Dec 29 '14 at 13:05
It's just the way it is. Synchronous AJAX blocks the browser, nothing happens while it's waiting. — Barmar, Dec 29 '14 at 13:06
@Barmar : can you tell me, if I use `$(options.before.element).html(options.before.html);` before `$.ajax({...})` is still not working why ? any idea ? — user3637224, Dec 29 '14 at 13:11
check if .html is cross-browser or $(options.before.element).html(options.before.html) works in chrome console — ppascualv, Dec 29 '14 at 13:26
Chrome doesn't permit cross browser Ajax calls try the same with this in bash: chromium-browser --disable-web-security — ppascualv, Dec 29 '14 at 13:59
Return expected results here http://jsfiddle.net/04qpcLyo/1/ ? — guest271314, Dec 29 '14 at 14:01
Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — Liam, Feb 19 '18 at 16:06

Ajax beforeSend issue only on chrome browser when async: false

0 Answers0

Linked