Melbin Mathai Melbin Mathai - 3 months ago 9
JSON Question

How to get the Data from the JSON file

I have a JSON data and a div in the code. I want to get the connections data from the JSON file to the people-update-container div. I tried the below code. But that is not working. Please help me to get the data from connections from the JSON file. JSOn data and the people-update-container files are in a same HTML page. Thank you.



var feed_json = [{  
  
     'teams' : [    {"total_count": '32'},
        "count" : "10",
                      "url"       : ""
                    },
                    { "id" : "id2",
                      "name" : "Group 2",
                      "count" : "55",
                      "url"       : ""
        }        
    
     ],
    
     'connections': [  {'total_count' : '110'},
                    
                   { "id" : "id1",
                      "name" : "Gossip Gang",
                      "count" : "20",
                      "url"       : ""
                   },
                   { "id" : "id2",
                      "name" : "JEC Folks",
                      "count" : "90",
                      "url"       : ""
                   }                    
                ]
                
}];



var feedConnections = feed_json.connections;

for(var i = 0; i < feedConnections.length; i++ ) {
var connection = feedConnections[i];

var id = connection.id;
var name = connection.name;
var count = connection.count;

var connectionFeed = $('<div><div id = '+ id +' style = "margin-top: 10px;"> <span class="expandIcon1" style="float: right;"> <img width="28" height="28" src="/media/images/icons/arrow-Down-lines.png"/> </span> <span class="barTitle">'+ name + '<span> (' + count + ')</span></span></div></div>');

$('.people-update-container').append(connectionFeed);
}

<div class = "people-update-container" style = "display: none;">

</div>




Answer

This will work. Resolve jquery error by adding jquery cdn path The problem was with your json data, which has some error.

var feed_json = {
"teams": [{
		"total_count": "32",
		"count": "10",
		"url": ""
	}, {
		"id": "id2",
		"name": "Group 2",
		"count": "55",
		"url": ""
	}

],

"connections": [{
		"total_count": "110"
	},

	{
		"id": "id1",
		"name": "Gossip Gang",
		"count": "20",
		"url": ""
	}, {
		"id": "id2",
		"name": "JEC Folks",
		"count": "90",
		"url": ""
	}
]

};


var feedConnections = feed_json.connections;

		for(var i = 0; i < feedConnections.length; i++ ) {
			var connection = feedConnections[i];

			var id = connection.id;
			var name = connection.name;
			var count = connection.count;

			//var connectionFeed = $('<div><div  id = '+ id +'  style = "margin-top: 10px;"> <span class="expandIcon1" style="float: right;"> <img  width="28" height="28" src="/media/images/icons/arrow-Down-lines.png"/> </span> <span class="barTitle">'+ name + '<span>  (' + count + ')</span></span></div></div>');

		//	$('.people-update-container').append(connectionFeed);
alert(name);
		}
<div class = "people-update-container" style = "display: none;">

</div>

Comments