user244394 user244394 - 19 days ago 5
jQuery Question

Jquery Ajax call to JSON not returning any data

I Have the following code below, I am trying to get the nested value of capital, city etc from the json file and create individual table for capital , city etc.

I tried the following code but I am not getting any results.

HTML

<table id="table">
<thead>
<tr>
<th>Head 1</th>
<th>Head 1</th>
<th>Head 1</th>
<th>Head 1</th>
<th>Head 1</th>
</tr>
</thead>
<tbody id="tablebody"></tbody>
</table>


JS

<script language="javascript">
window.getContent = function(URL) {
//////////////
var jsonData =URL;
console.log(" jsonData " + jsonData );
$.ajax({
url: jsonData ,
type: "get",
dataType: "json",
//jsonp:"jsoncallback",
success: function(data, textStatus, jqXHR) {

$('#records_table > tbody').empty();
var trHTML = '';
console.log("data " +data);
$.each(data.capital, function (i, item) {
console.log(" i " + i + " item+ "+item);
console.log(" i " + i + " item+ value"+item.capital);
console.log(" i " + i + " item+ value"+this.metricShortName);
console.log(" i " + i + " item+ value"+item.value);

/***************************/
$.each(item.capital, function (k, v) {
console.log("======================");
console.log(" i " + k + " V " +v);
console.log(" i " + k + " item+ value"+v.value);
console.log(" i " + k + " item+ value"+v.name);


/**
trHTML += '<tr>' +
'<td>' + item.name + '</td>' +
'<td>' + item.value + '</td>' +
'<td>' + item.description + '</td>' +
'<td>' + item.targetValue + '</td>' +

'</tr>';

**/

/***********************************/

});


/**************************/

});

$('#table > tbody').append(trHTML);


},
error: function(jqXHR, textStatus, errorThrown) {
console.log('FAILED to get JSON from AJAX call' + jqXHR + textStatus + errorThrown);

}
});


//////////////////
}


//table cell selection
$(document).ready(function(){

var url ="metric.json";
console.log(url);
getContent(url);

});

</script>

Answer

its data.capital.List, the List property is a array

     $.each(data.capital.List, function (i, item) {
     trHTML += '<tr>' +
               '<td>' + item.name + '</td>' +
               '<td>' + item.value + '</td>' +
               '<td>' + item.description + '</td>' +
               '<td>' + item.targetValue + '</td>' +
               '</tr>';
     });
Comments