title: Using jquery jsonp returns error callback function was not called
body: <p>I have the following <a href="http://jsfiddle.net/EWaUL/" rel="nofollow" title="fiddle">working example</a>, I'm trying to get <a href="http://detectlanguage.com" rel="nofollow">http://detectlanguage.com</a> via a jquery request.  Since this will be a cross-domain request I'm using jsonp.</p>
  
  <p>Here is <a href="http://social.msdn.microsoft.com/Forums/office/en-US/c04e9156-237b-486e-a635-227d1ed64ed2/not-able-to-make-http-request-from-a-taskpane-app?forum=appsforoffice" rel="nofollow">a link in MSDN</a> with a similar request where it's infered that <code>jsonp</code> is the way to go.</p>
  
  <p>Everything's fine, except the page throws an error <code>Error: myCallback was not called</code>, the response I get from server is the following:</p>
  
  <pre><code>{"data":
    {"detections":[
      {"language":"ca",
       "isReliable":false,
       "confidence":0.14992503748125938
      },
      {"language":"en",
       "isReliable":false,
       "confidence":0.00 8103727714748784
      }]
     }
  }
  </code></pre>
  
  <p>I've been searching all day in stackoverflow for answers regarding jsonp but haven't got it to work yet.</p>
  
  <p>Any help is very much appreciated</p>
  
  <p><strong>UPDATED</strong></p>
  
  <p>Including AJAX call</p>
  
  <pre><code>$.ajax({
      url: 'http://ws.detectlanguage.com/0.2/detect',
      data: {
          q: $('#hi').val(),
          key:'demo'
      },
      jsonpCallback: 'myCallback',
      dataType: "jsonp",
      success: myCallback,
      error: function(e,i,j){
           $('#results').html(j)
      }
  });
  </code></pre>
  
  <p>I also have a javascript function called <code>myCallback</code>:</p>
  
  <pre><code>function myCallback(response){
      alert(response.data)
  }
  </code></pre>