ajaxStart/ajaxStop issues with non-async requests

ajaxStart/ajaxStop issues with non-async requests

Hi,

I have a simple plugin (see below) that is used to display a loading spinner when doing ajax stuff. It seems to work fine in Firefox but in IE and Chrome it doesn't work. I use the same plugin in another project and it works fine in Chrome and IE so I'm really stuck with this.

According to this thread it is due to the request being not async but I tried it with an async request and it still doesn't work.

I'd really appreciate some help with this.

Thanks

Plugin code:

  1. (function($){
        $.fn.extend({
            ajaxLoadingSpinner: function(text) {
                return this.each(function() {
                    var loading = $('<div id="ajax-loading-spinner">' + text + '</div>')
                    .appendTo(document.body)
                    .hide();
                    $(document).ajaxStart(function() {loading.show()});
                    $(document).ajaxStop(function() {loading.hide()});
                });
            }
        });
    })(jQuery);