Nothing is wrong with my JSON but jQuery doesn't likey like. Please help

Question

I've built some JSON

{
    "News": {
         "Article": {"title": "test"},
         "Article": { "title": "test" },
         /*Snipped*/
         "Article": { "title": "test" },
         "Article": { "title": "test" }
    },
    "count": "20"
}

which validates in a JSON formatter http://jsonformatter.curiousconcept.com/. But when I try to ingest this data through jQuery I don't get what's expected:

$.getJSON('php/json.php', function(data) {
  console.log(data);
});

Results

News: Object
Article: Object
title: "test"
__proto__: Object
__proto__: Object
count: "20"

but where are my 19 other Article Objects? I'm new to JSON and jquery's getJSON. Is there anything I'm missing?

Answer 1

JavaScript objects are dictionaries, which means that the name must be unique. You're replicating Article, so each instance overwrites the previous (or is ignored; I don't know which path the parser takes).

To fix, you need to define this name as referencing an array:

{ "News": { "Article": [
                { "title": "test" }, 
                { "title": "test" }, 
                ...], 
             "count": "20" }

But you could probably reduce this further, assuming that all news items are articles, because count becomes superfluous:

{ "News": [
          { "title": "test" }, 
          { "title": "test" }, 
          ...] }

Answer 2

You defined the Article-key multiple times. This is not a syntax error (which is why the formatter does not complain) but rather a logical one. You should use an array instead.

Answer 3

A better format would be

{
    "News": {
         "1": {"title": "test","type":"article"},
         "2": {"title": "test","type":"article"},
         /*Snipped*/
         "19": {"title": "test","type":"article"},
         "20": {"title": "test","type":"article"}
    },
    "count": "20"
}

So you can do with each.

$.each(Object.news,function(id,ObjectItem){
    if(ObjectItem.type == 'article')
    {
        //do something with ObjectItem.title
    }
})