How to: Transverse JSON
New here? Learn about Bountify and follow @bountify to get notified of new bounties! x

I am familiar with iterating through XML but need guidance transitioning to JSON.
I'm sure this is simple but I've looked all over the "Internets" only to find overly complicated examples. Please help me :

  1. externally load a file named "myStuff.json" via jQuery Ajax get

2.Transverse through the document with jQuery grabbing all elements

3.display in an unordered list. I need it's JSON equivalent

  1. Please post working sample JS Fiddle

MY XML: pullData2.xml
<objects>
<person>
<name>John</name>
<street>Oak Way</street>
<kids>
<kid1>
<kidName>Amber</kidName>
</kid1>
<kid2>
<kidName>Jessy</kidName>
</kid2>
</kids>
</person>
</objects>

MY jQuery:

$.get('pullData2.xml', function(d){
$('#loadXML').append('<dl id="shufflePeople"/>');
$(d).find('person').each(function(){
var personName = $person.find('name').text(); ... ETC

MY JSON:myStuff.json
I think I'm nesting this right, if not please correct me

{
"objects": [
{ "person": [{"name": "John", "street":"Oak Way", "kids":[
{"kid1":["kidName":"Amber"]}
{"kid2":["kidName":"Jessy"]}
}] }
]
}

Your JSON should look like this: http://cargo.0x60.com/code/2s3z371p2j20
alex 8 years ago
awarded to ocanal

Crowdsource coding tasks.

3 Solutions

Winning solution

I think this not a useful JSON and It has some syntax error.

This is the json that I recommend.

https://dl.dropbox.com/u/39457223/bountify/myStuff.json

And here is a jsFiddle Example

http://jsfiddle.net/ocanal/QsHw4/3276/

You will just change the url and use it.

Righteous!!!! I instantly understood it the way you laid it out. :) Blessings!!!!
earthlyKit 8 years ago

You have not been writing valid JSON, which happens a lot when you are moving from XML as they are really different.

In the first link I've used $.getJSON to get your data, and then the callback loops through the necessary nodes to log out your different data points. If you view source on this, I've left comments explaining what is going on.

The second link is the JSON, here you can see the structure you were trying to achieve.

Fetching the JSON

The JSON file

Good luck!

View Timeline