jquery ajax call response in javascript is blank

Question

The fail function gives me a correct output, whereas the done function gives me blank. I am stuck with this for hours. Any idea on how to debug this?

var xhr = false;

if (window.XMLHttpRequest) {
    xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
}

if (contentType == null) {
    contentType = "application/json";
}

var reqst = $.ajax({
        beforeSend : function(req) {
          req.setRequestHeader("Content-Type", "application/json");
        },
        url : url,
        type : "post",
        contentType : contentType,
        data : paramsTable,
        });

reqst.done(function(xhr){
alert(xhr.responseText);
});

reqst.fail(function(xhr){
alert(xhr.responseText);
});

Answer 1

Try to use standard jquery ajax structure:

$.ajax({
    url: "test.html",
    context: document.body
}).done(function() {
    $( this ).addClass( "done" );
})
.fail(function() {
    alert( "error" );
});

Answer 2

I would like to recommend you to use Ajax jQuery API instead of the old Ajax requests. No body uses it today (almost nobody; since you use it)

$.ajax({
   beforeSend: function(req) {
     req.setRequestHeader("Content-Type", "application/json");
   },
   url: url,
   type: "post",
   contentType: contentType,
   data: paramsTable,
   success: function () {
     // here the code to execute if success
   },
   error: function () {
     // here the code to execute if error..
   }
});

Why your code isn't working

Because you are never using the xhr to send the Ajax request so it has nothing to show as the response text. Funny isn't it? hehehe.

use this:

success: function(resp) {
  alert(resp); // where resp is the name of the responseText here..
}

I have shown you how to use it. Good luck!

For more: http://api.jquery.com/jquery.ajax/