JQuery response is null but actual response is not

Question

I'm using JQuery to make an Ajax call. I used a sniffer to catch the response text:

{"error_code":0,"message":"SUCCESS","data":{"session_token":"3efd9dde-a839-4e91-9415-4c2f6cba5b7b"}}

But the response returned on the success callback is null. Anyone got any ideas? (see jquery code below.

Jquery code:

  $.ajax({
   type: "GET",
   url: "http://184.72.58.99/matchaapi/API/User/Login",
   data: { email: emailval, password: pwordval, developer_key: devkey },
   dataType: "json",
   cache: false,
   beforeSend: function(xhr) {
                           xhr.setRequestHeader( "Content-Type", "application/json; charset=utf-8" );
                       },
   success: function(resp) {
      alert(resp);
      $("#status p").html(resp.message);
     }});

Answer 1

What version of jQuery, and what browser? Try binding to the complete event rather than the success event.

Answer 2

According to the jQuery API docs:

The [success] function gets passed three arguments: The data returned from the server, formatted according to the 'dataType' parameter

Maybe the data isn't formatted as proper JSON?

Answer 3

Just a guess... is your site being served from the same site as the API you are trying to call? You can't make an AJAX request to another server directly from the browser unless you use JSONP (see jsonp parameter in jQuery.ajax()). If the API doesn't support it then you will need to proxy the calls through your web server.