jquery execute function while ajax response is loading

Question

How can I execute a function that will run while the client is waiting for the server response? Here is my code. I looked up and found a .load() function, but how does that fit into this? Any help would be great! Thanks

$.ajax({
    type: "POST",
    url: "mail.php",
    data: {name: name.val(), email: email.val(), phone: phone.val(), subject: subject.val(), message: message.val()}
    }).done(function(){
        alert("Your message was sent. We will be in contact with you shortly.");
        window.location="index.html";
});

Sorry, I don't know what I'm doing, it sounded best? I guess its not though? — eatonphil
– eatonphil, Commented Aug 25, 2012 at 21:15
And fwiw anything that you write in beforeSend is going to block the ajax request from firing until that code block has completed. So it actually doesn't do what you want at all. — Macdiesel
– Macdiesel, Commented Aug 25, 2012 at 21:23

Macdiesel · Accepted Answer · 2012-08-25 20:52:32Z

15

The very next line of code you write after You call $.ajax() will run while the browser is waiting for a response.

So:

$.ajax();
yourAwesomeFN();

XhttpRequests are asynchronous. No extra work required.

answered Aug 25, 2012 at 20:52

Macdiesel

9351 gold badge9 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Amin Eshaq · Accepted Answer · 2012-08-25 20:53:11Z

3

Have you looked in the "beforeSend" param.

$.ajax({
type: "POST",
    url: "mail.php",
    data: {name: name.val(), email: email.val(), phone: phone.val(), subject: subject.val(), message: message.val()},

   beforeSend: function(){
     // Handle the beforeSend event
   },
   complete: function(){
     // Handle the complete event
   }
   // ......
 });

answered Aug 25, 2012 at 20:53

Amin Eshaq

4,0241 gold badge19 silver badges21 bronze badges

1 Comment

Macdiesel Over a year ago

same comment as the other answer: beforeSend is going to block the ajax request from firing. This does not accomplish what the question had asked of executing code in the browser while the ajax request was being processed on the server.

moonwave99 · Accepted Answer · 2012-08-25 20:54:19Z

1

You can't execute a function while another is being executed in JS, being it mono-threaded: you can do stuff before and after though - are you looking for a way to setup a message / spinner to be shown while waiting? Check beforeSend option in $.ajax() call:

$.ajax({
    type: "POST",
    url: "mail.php",
    data: {name: name.val(), email: email.val(), phone: phone.val(), subject: subject.val(), message: message.val()}
    beforeSend : function(){

        // do your stuff here

    }
    }).done(function(){
        alert("Your message was sent. We will be in contact with you shortly.");
        window.location="index.html";
});

answered Aug 25, 2012 at 20:54

moonwave99

22.9k3 gold badges49 silver badges71 bronze badges

2 Comments

Macdiesel Over a year ago

beforeSend is going to block the ajax request from firing. This does not accomplish what the question had asked of executing code in the browser while the ajax request was being processed on the server.

moonwave99 Over a year ago

You're totally right, thank you for letting me have clue on proper beforeSend purpose.

Collectives™ on Stack Overflow

jquery execute function while ajax response is loading

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related