This post shows the examples of parsing a JSON from a jQuery ajax call.
1. SimpleJSON
[
{
customer_id:"1",
customer_name: "Jim"
},
{
customer_id:"2",
customer_name: "Joe"
}
]
Following is the AJAX call to parse the simple JSON data from the service
$('#ajax1').click(function(){
$.ajax({
url: "http://www.mocky.io/v2/54be41e83792d53a0ba6d5f3",
dataType: "jsonp",
success: function(result, status){
$('#result1').append("Status of the rest service is "+ status);
$.each(result,function(index){
$('#result1').append("
"+result[index].customer_id+" -- "+result[index].customer_name);
});
}
});
});
Note : I have used dataType as jsonp since , the the service I am fetching data from is on another domain.
2. Complex JSON
{
"employee": [{
"firstName": "John",
"LastName": "LaPhon",
"phoneNumber": ["7046996952", "7897786677"]
},
{
"firstName": "User",
"LastName": "Test",
"phoneNumber": ["23246952", "932423219"]
}
]
}
Following is the ajax call to parse above JSON request
$('#ajax2').click(function(){
$.ajax({
url : 'http://www.mocky.io/v2/54bf7334a84e11cc06149872',
dataType : "jsonp",
success : function(result, status){
var employees = result.employee;
$.each(employees,function(index){
$('#result2').append("
"+employees[index].firstName+" -- "+employees[index].LastName);
var phoneNumbers = employees[index].phoneNumber;
$.each(phoneNumbers, function(j){
$('#result2').append(" "+phoneNumbers[j]+" ");
});
});
}
});
});
Comments