ajax request is not stopping

Question

Here is my ajax call:

 $.ajax({
                        url: "AutoRFQ_Vendors_ST.aspx/BindVesselGrid",
                        type: "POST",
                        timeout: 3000,
                        data: JSON.stringify(sendingdata),                  
                        contentType: "application/json",
                        success: function (data) {
    //do something
    }

Here is my CSS loader:

  ajaxStart: function () { $body.addClass("loading"); },
            ajaxStop: function () { $body.removeClass("loading"); }

When I make an ajax call which responds d:'' an empty string but my ajaxstop: event is not firing.

in the success method of ajax you can use jquery to remove css dynamically — Rohit shah, Nov 28 '16 at 06:19

score 0 · Accepted Answer · answered Nov 28 '16 at 06:21

0

You have to hide your loader on ajax() complete like:

ajax({
    complete: function(){
        $body.removeClass("loading");
    }
});

complete executes after either the success or error callback were executed.

answered Nov 28 '16 at 06:21

Mayank Pandeyz

25,704
4
40
59

score 0 · Answer 2 · answered Nov 28 '16 at 06:26

You need to understand that the ajaxStart and the ajaxStop events falls under global event handlers in jQuery. Hence you need to hook them to document instead of having in your $ajax call.

You need to rewrite your code as,

$(document)
 .ajaxStart(function () {
   $body.addClass("loading");
 })
.ajaxStop(function () {
   $body.removeClass("loading");
});

Hope this helps!

ajax request is not stopping

2 Answers2