SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    820
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Json doesn't validate

    why does this JSON not validate in JSON Lint?

    Code:
    callback({
    "stores": [
    {
    "name": "sites",
    "content": [
    {
    "link_text": "link",
    "link_src": "http://www.store1.com/"
    },
    {
    "link_text": "link",
    "link_src": "http://www.store2.com/"
    },
    {
    "link_text": "link",
    "link_src": "http://www.store3.com/"
    },
    {
    "link_text": "link",
    "link_src": "http://www.store4.com/"
    },
    {
    "link_text": "link",
    "link_src": "http://www.store5.com/"
    },
    {
    "link_text": "link",
    "link_src": "http://www.store6.com/"
    }
    ]
    }
    ]
    });

    thank you....
    Last edited by spikeZ; Jun 30, 2013 at 01:04.

  2. #2
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,412
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Because it's wrapped in a callback, which is valid JS but not JSON:
    Code JavaScript:
    callback(
      // Valid JSON
    );
    If you strip away the callback code, everything else validates correctly.

  3. #3
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    820
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    ok.. thank you very much..

    I still find JSON so confusing... I wish we were all still just using XML....;-)

    so: is this "callback" thingie relevant for when I pull this JSON with jQuery/AJAX?

    thank you....

  4. #4
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,412
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    You don't need the wrapper for normal JSON, but if you want to request data from a different domain to the one your JS is running from, you have to use what's called JSONP. It's a way of getting around the same origin policy. There's a good explanation over at wikipedia: http://en.wikipedia.org/wiki/JSONP

  5. #5
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    820
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    ok, so JSONP is only for when you're pulling from a remote domain?

    that "callback" thingie is only necessary for JSON feeds that will be accessed remotely?

    I've dabbed a bit in pulling from public JSON feeds..... for example...

    http://api.flickr.com/services/feeds...jsoncallback=?

    it's wrapped in parenthesis, is this what you mean? (it doesn't have the world "callback", but it looks like it's the same thing.. is this correct?)

    thank you...

  6. #6
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,412
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Yeah, you can call the function whatever you want.. some people name it callback, but that's just a matter of preference. In the flickr URL you gave, you can change the name of the callback function by changing this part of the query string: &jsoncallback=foobar (try this and you'll see that the returned JSON is wrapped in a call to the function foobar).

  7. #7
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    820
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    actually, this public JSON,

    http://api.flickr.com/services/feeds...ny&format=json

    is not wrapped in a "callback" thingie... it's not wrapped in parenthesis.....

    so I guess I'm confusing the "callback" that's part of JSON address url (when you call it with JSONP) and this "callback" word that, in some cases, I guess, wraps public JSON feeds.......

    thank you.....

  8. #8
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,716
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by maya90 View Post
    so I guess I'm confusing the "callback" that's part of JSON address url (when you call it with JSONP) and this "callback" word that, in some cases, I guess, wraps public JSON feeds.......
    JSON is nothing more than data contained within an object notation, so that different types of data structures can be represented.
    With JSONP, that wraps the same data with a function name of your choice, so that once it has been retrieved in to a script tag, that function name executes with that data. As said before, it's a work-around to allow you to obtain that data from some other origin.

    It's no more complex than that
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  9. #9
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    820
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    yes..... it's data contained within an object notation, that can get very complex as you can nest arrays in objects and objects in arrays... yes? ;-)

    here are three JSON examples:


    Code:
    {
        "users": [
            {
                "firstName": "Ray",
                "lastName": "Villalobos",
                "joined": {
                    "month": "January",
                    "day": 12,
                    "year": 2012
                }
            },
            {
                "firstName": "John",
                "lastName": "Jones",
                "joined": {
                    "month": "April",
                    "day": 28,
                    "year": 2010
                }
            }
        ]
    }

    Code:
    {"skills": {
    
    	"web":[
    		{"name": "html", 
    		 "years": "5"
    		},
    		{"name": "css", 
    		 "years": "3"
    		}],
    		
    	"database":[
    		{"name": "Oracle", 
    		 "years": "3"
    		},
    		{"name": "MySQL", 
    		 "years": "4"
    		}]
    }}

    this one doesn't have a name.....


    Code:
    {
    	"header": "List of Books",
    	"theBooks" : [
    		{ "title": "title-1",
    			"author": "author-1" },
    		{ "title": "title-2",
    			"author": "author-2" }
            ]
    }

    this is the fundamental problem I have with JSON: each JSON is structured so differently, that I can't find a formula for parsing them that servers for all of them...


    Code:
    $.getJSON('json/skills.json', function(data) {
    "data" is always the entire JSON, right? the entire object? just as I posted them here?

    but then, how you parse is very different for each one of the three examples I have posted here.... yes?


    I do know that objects are lists of key-value pairs and are always wrapped in '{}'; and that arrays are just lists of values and are always wrapped in '[]'
    (but you can have arrays inside objects and vice-versa, right? the nesting can be endless.....;-)

    would very much appreciate some comments and insights from folks much wiser than I am.......:~)

    thank you very much.....

  10. #10
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,412
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by maya90 View Post
    but then, how you parse is very different for each one of the three examples I have posted here.... yes?
    It's no different from XML in that respect - you still need to know the schema of the data that is returned, and each API tends to be different.

  11. #11
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,716
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by maya90 View Post
    "data" is always the entire JSON, right? the entire object? just as I posted them here?

    but then, how you parse is very different for each one of the three examples I have posted here.... yes?
    This is why there tends to be a standard schema that each one uses. Flickr for example, has documentation on how they would expect you to interpret the information from them.
    http://www.flickr.com/services/api/response.json.html
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  12. #12
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    820
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thank you Paul.....

    ok, I think I'm FINALLY starting to GET IT.....:-)

    the KEY is whether you're looping thru an array or thru an object.... I'm very clear about that now...
    (at least as it works with jQuery $.each() method....)

    and: and array is not always just a list of values, it can be a list of objects too... as in this example:

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

    in which "users" contains just one array that contains two objects....

    I just parsed this on my own from scratch...

    I would appreciate some comments on my code.......:-)

    (I don't get why the <h1> is appearing after the JSON content..... (??)


    thank you very much....

  13. #13
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,412
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by maya90 View Post
    (I don't get why the <h1> is appearing after the JSON content..... (??).
    Because you're calling $('body').append() which is adding the H1 as the last item inside the body tag (after div#users). To insert the H1 before the content, use $('body').prepend()


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
  •