Fire event right after event was sent but before it was completed

Question

I have the following situation. I need to fire some event right after my ajax request was sent but before it has completed. Looking at the documentation I see whole bunch of events: beforeSend, complete, error, success, done, always. But there is nothing that looks like event I want.

So is it possible to do?

Just to highlight what exactly do I want to achieve:

    var foo = 'BAR';
    $.post('serverURL', {
        T: foo,
    }, function(data){
        //...
    }, 'json');

    foo = '';

So I have a code similar to this. And the way it works is perfectly fine (it sends correct foo to the server and than right after it send it it modifies it). It modifies it not when the ajax is done/finished/successed/failed, but right after it fires.

I want to put this modification foo = '' in a callback, (like success callback). Just to answer why do I need to do this: some people when they read a code, decide to "improve" it by moving foo = '' somewhere else (before the ajax) and thus introduce the bug which is hard to spot. Comments like // Do not move it do not help.

@Salvador Dali See http://api.jquery.com/deferred.then/ at "Example: Chain tasks" Hope this helps — guest271314, Mar 19 '14 at 05:08
@Pilot any function. Something that you would put in `success` or `done`. I know that I can put it right after ajax call, but is there anything else? — Salvador Dali, Mar 19 '14 at 05:09
@guest271314 thanks, but deffered is something that happens after ajax finished. — Salvador Dali, Mar 19 '14 at 05:10
@SalvadorDali Completely wrong..You can attach event handler to Defered object — Deepak Ingole, Mar 19 '14 at 05:10
@Pilot hm... can you please show me how can I use deferred to get the behaviour I want? — Salvador Dali, Mar 19 '14 at 05:14
@SalvadorDali you might want to play round with `xhr` object method `onreadystatechange` — Deepak Ingole, Mar 19 '14 at 05:53
@Salvador Dali Have you tried updated answer? `foo` as function? returns `""` default; when executed with `$.post()` function called with argument; though `default` return value not really change. Thanks for sharing. Hope this helps — guest271314, Mar 20 '14 at 15:53

score 0 · Answer 1 · answered Mar 19 '14 at 05:10

0

There exists a global jQuery ajax event handler:

$(document).ajaxStart(function(){   ...    });

, which is called when the first Ajax request starts.

answered Mar 19 '14 at 05:10

Kyo

974
5
10

ajaxStart will be executed for every ajax that will be called. – Salvador Dali Mar 19 '14 at 05:13
You could bind the ajaxStart into a specific element, as seen here ( http://stackoverflow.com/questions/1191485/how-to-call-ajaxstart-on-specific-ajax-calls ), but not clear if this is what you want to do. – Kyo Mar 19 '14 at 05:19

Nurdin · Answer 2 · 2014-03-19T06:13:02.940

0

How about this one?

formData = {
    param1: "param1"
}
$.ajax({
    type: 'GET',
    contentType: 'application/json',
    url: "https://example.com/detail.php",
    dataType: "json",
    data: formData,
    beforeSend: function() {
        //before handler
    },
    success: function(data) {
        //success handler
    },
    complete: function(data) {
        //complete handler
    },
    error: function(data) {
        //error handler
    }
});

edited Mar 19 '14 at 06:13

answered Mar 19 '14 at 05:19

Nurdin

23,382
43
130
308

No, all of them will execute after ajax will finish. Some error, when it was unsuccessful. – Salvador Dali Mar 19 '14 at 06:09
I already answered to someone in the comments that beforeSend fires an event right before the ajax have started. Not right after it started. – Salvador Dali Mar 19 '14 at 06:22

Fire event right after event was sent but before it was completed

2 Answers2

Linked