Step1:
Welcome to designerdairy
Step2:
Below is the example code for iterating the Json arry objects and nested objects
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// Creating a JSON object
var employeeJSON = [
{
"firstName": "Todd",
"lastName": "Grover",
"gender": "Male",
"salary": 50000
},
{
"firstName": "Sara",
"lastName": "Grover",
"gender": "Male",
"salary": 60000
}]
var employeenestedJSON = {
"todd": {
"firstName": "Todd",
"lastName": "Grover",
"gender": "Male",
"salary": 50000
},
"Sara": {
"firstName": "Sara",
"lastName": "Grover",
"gender": "Male",
"salary": 60000
}
}
//{
// "firstName": "Mary",
// "lastName": "Grover",
// "gender": "Male",
// "salary": 60000
//}];
// Accessing data from a JSON object
var result = '';
//$.each(employeeJSON, function(index, element)
//{
//result += index + element + '<br/>';
// result += '<br/>';
// result += 'First Name = ' + employeeJSON[index].firstName + '<br/>';
// result += 'Last Name = ' + employeeJSON[index].lastName + '<br/>';
// result += 'Gender = ' + employeeJSON[index].gender + '<br/>';
// result += 'Salary = ' + employeeJSON[index].salary + '<br/>';
//});
var result = JSON.stringify(employeeJSON);
var jsonstring = '[{"firstName":"Todd","lastName":"Grover","gender":"Male","salary":50000}]';
var jsonobject = JSON.parse(jsonstring);
var results = "";
// object iteration
// $.each(jsonobject, function(index, item)
// {
// results += index + ":" + item + "<br/>";
// });
// array object iteration
// $.each(jsonobject, function(index, item)
//{
// results += "FirstName =" + jsonobject[index].firstName + "<br/>";
// results += "LastName =" + jsonobject[index].lastName + "<br/>";
// results += "Gender =" + jsonobject[index].gender + "<br/>";
// results += "salary =" + jsonobject[index].salary + "<br/>";
//});
// nested object iteration
console.log(employeenestedJSON);
$.each(employeenestedJSON, function(index, item)
{
var fname = a["firstName"];
var gender = a["gender"];
results += "First Name : " + a.firstName + "<br/>";
results += "Last Name : " + a.lastName + "<br/>";
results += "Gender : " + a.gender + "<br/>";
results += "Salary : " + a.salary + "<br/>";
});
$('#resultDiv').html(results);
});
</script>
</head>
<body style="font-family:Arial">
<div id="resultDiv"></div>
<div id="resultDivz"> d</div>
</body>
</html>
Step3:
Thanks for readingm y article .Stay Tune on www.webdesignersdairy.com for more updates on Jquery.
Welcome to designer
Step2:
Below is the example code for iterating the Json arry objects and nested objects
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// Creating a JSON object
var employeeJSON = [
{
"firstName": "Todd",
"lastName": "Grover",
"gender": "Male",
"salary": 50000
},
{
"firstName": "Sara",
"lastName": "Grover",
"gender": "Male",
"salary": 60000
}]
var employeenestedJSON = {
"todd": {
"firstName": "Todd",
"lastName": "Grover",
"gender": "Male",
"salary": 50000
},
"Sara": {
"firstName": "Sara",
"lastName": "Grover",
"gender": "Male",
"salary": 60000
}
}
//{
// "firstName": "Mary",
// "lastName": "Grover",
// "gender": "Male",
// "salary": 60000
//}];
// Accessing data from a JSON object
var result = '';
//$.each(employeeJSON, function(index, element)
//{
//result += index + element + '<br/>';
// result += '<br/>';
// result += 'First Name = ' + employeeJSON[index].firstName + '<br/>';
// result += 'Last Name = ' + employeeJSON[index].lastName + '<br/>';
// result += 'Gender = ' + employeeJSON[index].gender + '<br/>';
// result += 'Salary = ' + employeeJSON[index].salary + '<br/>';
//});
var result = JSON.stringify(employeeJSON);
var jsonstring = '[{"firstName":"Todd","lastName":"Grover","gender":"Male","salary":50000}]';
var jsonobject = JSON.parse(jsonstring);
var results = "";
// object iteration
// $.each(jsonobject, function(index, item)
// {
// results += index + ":" + item + "<br/>";
// });
// array object iteration
// $.each(jsonobject, function(index, item)
//{
// results += "FirstName =" + jsonobject[index].firstName + "<br/>";
// results += "LastName =" + jsonobject[index].lastName + "<br/>";
// results += "Gender =" + jsonobject[index].gender + "<br/>";
// results += "salary =" + jsonobject[index].salary + "<br/>";
//});
// nested object iteration
console.log(employeenestedJSON);
$.each(employeenestedJSON, function(index, item)
{
var fname = a["firstName"];
var gender = a["gender"];
results += "First Name : " + a.firstName + "<br/>";
results += "Last Name : " + a.lastName + "<br/>";
results += "Gender : " + a.gender + "<br/>";
results += "Salary : " + a.salary + "<br/>";
});
$('#resultDiv').html(results);
});
</script>
</head>
<body style="font-family:Arial">
<div id="resultDiv"></div>
<div id="resultDivz"> d</div>
</body>
</html>
Step3:
Thanks for reading
No comments:
Post a Comment