2

i have multiple ajax and i handle on done and on fail.

$.when(

   $.ajax({
        url: "/ajax",
        type: "POST",
        data: {
             _xsrf: xsrf_token,
             'action': "/document/x",
             'values': JSON.stringify(values)
             }
      }).done(function() {
           console.log("done!");
           window.location.reload();
      }).fail(function(jqXHR, textStatus) {
           console.log(jqXHR);
           $('#error').text(textStatus);
  })
).then(function() {

 // All have been resolved (or rejected)

 });

In chrome and IE when the ajax is succesfull it ends in done, and shows some message that the call was sucessfull and the page is reloaded. In FF if the call is succesfull it goes first in fail and the it goes in done .. any idea?

edit:

This behaviour is only in a specific case: I am trying to remove and also add the same user in the database in two asynchron calls in the $.when: which from user side is possible, but the asynchron calls are handled different in the different browsers.

Monicka
  • 505
  • 6
  • 20
  • I see some `Syntax Errors`. Please update code – Tushar Jun 15 '15 at 14:39
  • you're misusing $.when. that code should be throwing syntax errors in all browsers, not just firefox. copy paste error? – Kevin B Jun 15 '15 at 14:42
  • and the downvote is because? – Monicka Jun 15 '15 at 14:46
  • your question was unclear due to the, i'm assuming, copy paste failure. – Kevin B Jun 15 '15 at 14:56
  • Now i still find it unclear, because it isn't possible for both done and fail to be called, as described in your question. – Kevin B Jun 15 '15 at 14:57
  • well for me is also unclear, that's why i am asking, maybe someone else had the same experience. – Monicka Jun 15 '15 at 14:58
  • Are you sure the done and fail callbacks being called are coming from the exact same ajax request? (check network tab for multiple ajax requests being sent) my expectation is that two are being sent, and the 2nd is failing due to the first doing a window.location.reload. – Kevin B Jun 15 '15 at 14:59
  • it's only one tab. I am presenting the error (when appears) in the dialog too. – Monicka Jun 15 '15 at 15:03

1 Answers1

2

I think you are misusing the jQuery.when(), because that method is part of the Deferred object, which implements the Promise interface, and the jqXHR object returned by jQuery.ajax() implement the Promise interface, giving them all the properties, methods, and behavior of a Promise (see Deferred object for more information)

A more proper way to write the previous code could be as follow:

var promise = $.ajax({
  url: "/ajax",
  type: "POST",
  data: {
    _xsrf: xsrf_token,
    action: "/document/x",
    values: JSON.stringify(values)
  }
});

promise.done(function () {
  console.log("done!");
  window.location.reload();
});

promise.fail(function (jqXHR, textStatus) {
  console.log(jqXHR);
});

Or if you want to use jQuery.when()

$.when(
  $.ajax({
    url: "/ajax",
    type: "POST",
    data: {
      _xsrf: xsrf_token,
      action: "/document/x",
      values: JSON.stringify(values)
    }
  })
).then(
  function done() {
    console.log("done!");
    window.location.reload();
  },
  function fail(jqXHR, textStatus) {
    console.log(jqXHR);
  }
);

I encourage you to read the links provided.

Happy reading and happy conding!

jherax
  • 5,238
  • 5
  • 38
  • 50