SitePoint Sponsor

User Tag List

Page 2 of 2 FirstFirst 12
Results 26 to 32 of 32
  1. #26
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    826
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    ok, here is my attempt at dealing with this "callback" issue:

    http://mayacove.com/dev/json/userspc.html
    (again, this needs to work in my localhost, where it's a remote domain, am just posting here to show my code... and it's not working in my localhost....)

    in localhost get exactly same error as you get when you run it in above url....


    I'm using the first approach Paul posted, as I'm not connecting to any back-end....

    is the callback fn called automatically onload?

    or do I have to call it onload (inside document.ready() thingie?)

    still confused about this....

  2. #27
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by maya90 View Post
    is the callback fn called automatically onload?
    The JSONP code that you fetch does that call for you. You do not need to run the callback function yourself.

    Quote Originally Posted by maya90 View Post
    or do I have to call it onload (inside document.ready() thingie?)
    [/QUOTE]

    The callback function needs to be available from the global scope, so it needs to be defined outside of the document.ready function.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #28
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    826
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    oh my gosh, I finally got it!!

    http://mayacove.com/dev/json/userspc.html

    this works in my localhost now...:-)

    I finally got it when read here
    http://stackoverflow.com/questions/4...on-not-defined

    JSON-P is added to the document using a script element, so the function call inside it has to reference a function that exists in the global scope.
    meaning: it literraly adds:

    Code:
    <script type="text/javascript">
    
      callback(
    
    	{"users":[
    			{
    				"firstName":"Ray",
    				"lastName":"Villalobos",
    				"joined": {
    					"month":"January",
    					"day":12,
    					"year":2012
    				}
    			},
    			{
    				"firstName":"John",
    				"lastName":"Jones",
    				"joined": {
    					"month":"April",
    					"day":28,
    					"year":2010
    				}
    			}
    	]}
    	
    	
    	
    	
    );
    </script>
    to your <head> element.....

    lol... it's kind of funky (like so many things JS....;-)

    it adds a call to the callback fn wrapped in a <script> tag in your <head> and passes it the entire JSON you're grabbing from a remote domain....
    (the "JSON" is just a fn call to which the JSON is passed....lol... what is actually passed to the callback fn is technically just a regular JS object, right?)

    (now I don't understand how the Flicker one works......;-)
    (funny, if I use just 'callback' in that one in url instead of 'jsconcallback' it doesn't work.. but I don't see how 'jsoncallback' is defined anywhere....)

    ok, finally.. thank you SO MUCH...

    I learned so much with your help....:-)

  4. #29
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    826
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    oh my gosh..... this is weird...

    I added 'success' & 'error' properties to the $.ajax fn, and it's printing FAIL!!
    in my localhost too.... (???)

    http://mayacove.com/dev/json/userspc.html

    WTF??

    thank you....

  5. #30
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by maya90 View Post
    I added 'success' & 'error' properties to the $.ajax fn, and it's printing FAIL!!
    Your page that contains the JSON data is failing to respond properly. jQuery expects the callback to be that which it requested, in this case the request is for:
    Code:
    http://mayacove.com/dev/json/json/usersp.json?callback=jQuery18307146045416593552_1372682088982&_=1372682088990
    So when jQuery doesn't receive JSONP that is wrapped with the callback function name, that is an error, and is considered to be a fail.

    If you want the success/fail stuff to work properly, you will need to follow the proper procedures. Otherwise just ignore it.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  6. #31
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    826
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    oh man.... (sigh....;-) ok....


    (didn't I say 'funky'?? :-)


    again, thank you very much for your help.....

  7. #32
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    I should mention, that you can force jQuery to not use its own JSONP callback name, so that you can tell jQuery of the name that you want to use instead. This will result in it properly detecting a success situation for you.

    For example:

    Code javascript:
    var callbackName = 'callback';
     
    $.ajax({
        dataType: 'jsonp',
        jsonp: false,
        jsonpCallback: callbackName,
        url: 'http://mayacove.com/dev/json/json/usersp.json?callback=' + encodeURIComponent(callbackName),
        success: ...,
        fail: ...
    });

    The jsonp:false tells jQuery to not add its own callback parameter on to the url, and jsonpCallback is where you tell jQuery the name of the callback that you are using instead.

    I've put the callback name in to a variable, so that it's not being duplicated in different places, and the encodeURIComponent part is just a standard safety precaution.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •