Response/callback for JSONP using jQuery $.ajax not working

Question

I am unable to catch response from C# to jQuery using $.ajax . I get an error "SCRIPT ERROR" . How can I catch response using JSONP? This is what i am using:

$.ajax({
    async: true,
    context: mrq,
    cache: false,
    type: "GET",
    url: MYURL,
    crossDomain: true,
    dataType: 'jsonp',
    data: MYDATA,
    processData: false,
    jsonp: "jsonREQ",
    jsonpCallback: "onJSONPsuccess",
    success: function (jsonText, textStatus) {}
});

Answer 1

As far as I understand, dataType: 'jsonp' means that as soon as it's returned it's put into the callback function as an argument. So, I'd try this:

onJSONPsuccess = function(response) {
  // do something with response, e.g.
  results = response["results"]
}

$.ajax({
  crossDomain: true,
  dataType: 'jsonp',
  data: { /*params you're sending in*/ },
  jsonp: "jsonREQ",
  jsonpCallback: "onJSONPsuccess",
  success: onJSONPsuccess
});

Answer 2

You say the server side is C# - are you using WCF? There's a great article here about it: http://bendewey.wordpress.com/2009/11/24/using-jsonp-with-wcf-and-jquery/

Basically you need to set up WCF (or whatever server-side code you're using) to return the json wrapped in a call to your callback function.

However, with jquery, you can simply add "?Callback=?" to your URL, change the dataType to 'jsonp', and forget about the rest of that stuff. You don't need the jsonp or jsonpCallback options set.

In contrast to a json request, the jsonp request will return your data not wrapped in a 'd' property, so your call back function is:

function(data) { var a = data.myProperty ... }

rather than

function(data) { var a = data.d.myProperty ... }

and the whole method is along the lines of:

var url = configuration.serviceUrl + "/" + method + "?callback=?";

var options = {
    type: 'GET',
    url: url,
    data: args,
    dataType: "jsonp",
    contentType: "application/json",
    success: function(data) {
        if (callback != null) callback(data);
    }
};

if (typeof errorCallback != 'undefined')
    options.error = errorCallback;

$.ajax(options);