Question

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.

Answer 1

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!

jquery ajax fails in firefox

1 个答案: