JQuery: AJAX error: get data sent to server

Question

This should be simple, but I can't find info anywhere on how to do it:

$.ajax({
    type: 'POST',
    url: 'addToBasket.php',
    data: 'id='+id,
    // ....
    error: function(xhr, textStatus, error){
        // how to get the id sent to the server?
    },
    success: function(data, textStatus, xhr){}
});

How can the error handling function access the data sent to the server in the request?

I am not sure but i guess you can't get sent data in callback as an argument simply because data couldn't be sent to server that's why the request faild after all, i may not be right but its just a gues... — user2009750, Apr 13 '14 at 10:40

score 1 · Answer 1 · answered Apr 13 '14 at 10:47

1

Try this it may help make the 'id' which is sent to the server as a global variable and access it

var id='bla bla'
$.ajax({
type: 'POST',
url: 'addToBasket.php',
data: 'id='+id,
// ....
error: function(xhr, textStatus, error){
    // how to get the id sent to the server?
 alert(id);
},
success: function(data, textStatus, xhr){}
});

answered Apr 13 '14 at 10:47

vivek

309
1
2
8

Thanks - the problem is I have multiple asynchronous requests, and if possible I would rather not have to roll my own way of identifying which request the error came from, if JQuery already has a way of doing it (reinventing the wheel) – Jodes Apr 13 '14 at 10:51

score 1 · Answer 2 · edited May 23 '17 at 12:32

You can access the data property of the ajax options inside the error handler with just this.data.
If you don't specifically set the context property, this inside the callbacks for $.ajax will always be the ajax call itself, and then this.data will be the serialized string of the data you passed in.

$.ajax({
    type  : 'POST',
    url   : 'addToBasket.php',
    data  : 'id='+id,
    error : function(xhr, textStatus, error){
        var data = this.data; // "id=something"
    },
    success : function(data, textStatus, xhr){}
});

FIDDLE

If you need to parse that string into an object, here's how -> How can I get query string values in JavaScript?

You could also use the global error handler to get the data object, as it the ajax call as it's first argument.
It will fire on all ajax errors, but can be filtered by URL or any other option passed etc.

$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
    if (ajaxSettings.url == 'addToBasket.php') {
        alert(ajaxSettings.data)
    }
});

FIDDLE

Hammersholt · Answer 3 · 2014-10-25T13:45:18.767

Although this is an old question i have the exact same challenge as Jodes

I found that using this inside the error function holds the ajax object and from that you can extract the data (this.data) although its url encoded

$.ajax({
type: 'POST',
url: 'addToBasket.php',
data: 'id='+id,
// ....
error: function(xhr, textStatus, error){
    // how to get the id sent to the server?
    console.log(this.data);
},
success: function(data, textStatus, xhr){}
});

Hope this helps

edit: I used https://gist.github.com/brucekirkpatrick/7026682 for unserializing the data string

JQuery: AJAX error: get data sent to server

3 Answers3

Linked