title: jQuery $.ajax call for cross domain with JSONP, returns status 200, but error function is being called instead of success
body: <p>My web application is trying to access the information from another server belonging to a different domain. Since it is a cross domain ajax call, i have used "dataType" as "JSONP" instead of JSON. </p>
  
  <p>Now in the WebInspector-> Network Tab, I see the request is successful and the response is populated. But the success() function is never called. It always calls the error function with status = 200.</p>
  
  <p>Since it is a JSONP request, jQuery appends "callback=?" to the end of the URL and the callback method was never called, even after getting the valid response. Not sure what went wrong?</p>
  
  <pre><code>$(document).ready(function() {
      // When you click the Get Instances button:
      $('#getInstances').click(function(){
          $.ajax({
              type: "GET",
              url: "http://178.28.167.221:8080/us-east-1/instance/list.json",
              contentType: "application/json; charset=utf-8",
              accept: "application/json",
              crossDomain: "true",
              headers: {'Access-Control-Allow-Origin','*'},
              dataType: "jsonp",
              success: function(msg) {
                  result = JSON.stringify(msg);
                  var obj = $.parseJSON(result);
                  console.log(obj);
                  $('#instancesTable').append('&lt;tr&gt;&lt;td&gt;' + obj.autoScalingGroupName + '&lt;/td&gt;&lt;td&gt;' + obj.amiId + '&lt;/td&gt;&lt;td&gt;' + obj.instanceId + '&lt;/td&gt;&lt;td&gt;' + obj.instanceType +'&lt;/td&gt;&lt;/tr&gt;');                                     
              },
              error: function(xhr, ajaxOptions, thrownError, textStatus, responseText) {
                  console.log(name + ' environment failed with error: ' + xhr.status + "  " + thrownError);
  
                  var errorMessage = "Error";
                  if (xhr.status == 0) {
                      errorMessage = "Can't Connect";
                  }
              }
          });
      });
  });
  </code></pre>
  
  <p>I also verified by including the below in my ajax request:</p>
  
  <pre><code>        jsonp: 'callback',
          jsonpCallback: 'jsonpCallback'
  </code></pre>
  
  <p>and defining the callback function as below:</p>
  
  <pre><code>       function jsonpCallback(data){
           alert("jsonpCallback");
         }
  </code></pre>
  
  <p>jsonCallback was never called, even if the request is successful and response is available from the server (shown in Network Tab of WebInspector).</p>
  
  <p>The response from the server is an Array of JSON objects. [{JSON1}, {JSON2} ..]</p>
  
  <p>Note : I tried to change the contentType as "application/javascript" since the response was an array of JSON objects. But nothing worked :(</p>