No response when using jQuery/AJAX with JSONP

Question

I am trying to make a cross-domain request using jQuery/AJAX. I have the following code;

$.ajax({
   url: "http://www.cjihrig.com/development/jsonp/jsonp.php?callback=jsonpCallback&message=Hello",
   crossDomain:true
})
.done(function( msg ) {
  alert( "Done : " + msg );
})
.fail(function( msg) {
  alert( "Fail : " + msg);
})
.always(function( msg ) {
  alert( "Always : " + msg );
});

The URL http://www.cjihrig.com/development/jsonp/jsonp.php?callback=jsonpCallback&message=Hello returns JSON object when calling directly and works fine when using JSONP in traditional manner (i.e. through dynamic script tag injection)

But why do I get an error when using it with jQuery/AJAX ?

You need to tell jQuery to use JSONP. http://jsfiddle.net/CttQZ/ — JJJ, Mar 19 '13 at 11:41
Ok..thx a lot...Does this also not work when testing from local machine ? — copenndthagen, Mar 19 '13 at 11:44

Alessandro Minoccheri · Answer 1 · 2013-03-19T16:05:36.463

1

Try this code because the error isn't set the dataType and isn't expect a jsonp default
dataType: (default: Intelligent Guess (xml, json, script, or html))
Type: String

  $.ajax({
   url: "http://www.cjihrig.com/development/jsonp/jsonp.php?callback=jsonpCallback&message=Hello",
   dataType: 'jsonp',
   crossDomain:true,
    jsonp: false,
    success: jsonpCallback,
})
.done(function( msg ) {
  alert( "Done : " + msg );
})
.fail(function( msg) {
  alert( "Fail : " + msg);
})
.always(function( msg ) {
  alert( "Always : " + msg );
});

 function jsonpCallback(data){
        alert("jsonpCallback");
    }

DEMO

edited Mar 19 '13 at 16:05

answered Mar 19 '13 at 11:43

Alessandro Minoccheri

35,521
22
122
171

Can I optimize the code further like split the URL and have the query string part (thing after ?) in a separate variable ? – copenndthagen Mar 19 '13 at 11:53
you can use a viariable called params and concatenate it 'http://www.cjihrig.com/development/jsonp/jsonp.php?'+params, @testndtv – Alessandro Minoccheri Mar 19 '13 at 11:56
Actually I was asking if it is possible to define the part "callback=jsonpCallback&message=Hello" in a separate AJAX settings variable ? Also my callback function is not getting executed...How do I do that ? like here I have defined function jsonpCallback() ...but it does not get called... – copenndthagen Mar 19 '13 at 12:00
Ok you can use the param data like this: data: {status: status, name: name}, @testndtv – Alessandro Minoccheri Mar 19 '13 at 13:08
Ok..also why does jsonpCallback() not get called after the AJAX request is complete ? – copenndthagen Mar 19 '13 at 13:20
I think you have to declare It like this type: jsonpCallback: 'jsonpCallback', where jsonpCallback is a function @testndtv – Alessandro Minoccheri Mar 19 '13 at 13:27
for this problem I have found this question I hope it will be helpful for you http://stackoverflow.com/questions/6215235/jsonpcallback-function-not-working @testndtv – Alessandro Minoccheri Mar 19 '13 at 14:14
I tried all the solutions listed there...But still does not work...jsonpCallBack: function() { alert('boo'); } – copenndthagen Mar 19 '13 at 15:43
Is it possible for you to try it out? – copenndthagen Mar 19 '13 at 15:43
I have update my answer and the jsfiddle with another solution – Alessandro Minoccheri Mar 19 '13 at 16:05
So in your example it is the success function which is getting called back and not the jsonpcallback.... – copenndthagen Mar 19 '13 at 17:37

score 0 · Answer 2 · answered Mar 19 '13 at 11:43

0

I would use $.ajax with the option:

dataType: "jsonp"

This automatcially adds the callback option to the url. http://api.jquery.com/jQuery.ajax/

answered Mar 19 '13 at 11:43

SteveP

18,840
9
47
60

No response when using jQuery/AJAX with JSONP

2 Answers2