jquery $.each() for objects
$.each()
works for objects and arrays both:
var data = { "programs": [ { "name":"zonealarm", "price":"500" }, { "name":"kaspersky", "price":"200" } ] };
$.each(data.programs, function (i) {
$.each(data.programs[i], function (key, val) {
alert(key + val);
});
});
...and since you will get the current array element as second argument:
$.each(data.programs, function (i, currProgram) {
$.each(currProgram, function (key, val) {
alert(key + val);
});
});
Insert data in "INId" div...
$(document).ready(function() {
var data = { "programs": [ { "name":"zonealarm", "price":"500" }, { "name":"kaspersky", "price":"200" } ] };
$.each(data.programs, function(key,val) {
// console.log(val);
$('#InId').append("Name: " +val.name+" & Price: "+val.price+"<br/>");
});
});
$(document).ready(function() {
var data = { "programs": [ { "name":"zonealarm", "price":"500" }, { "name":"kaspersky", "price":"200" } ] };
$.each(data.programs, function(key,val) {
// console.log(val);
$('#InId').append("Name: " +val.name+" & Price: "+val.price+"
");
});
});
You are indeed passing the first data item to the each function.
Pass data.programs to the each function instead. Change the code to as below:
<script>
$(document).ready(function() {
var data = { "programs": [ { "name":"zonealarm", "price":"500" }, { "name":"kaspersky", "price":"200" } ] };
$.each(data.programs, function(key,val) {
alert(key+val);
});
});
</script>
Basically you need to do two loops here. The one you are doing already is iterating each element in the 0th array element.
You have programs: [ {...}, {...} ] so programs[0] is { "name":"zonealarm", "price":"500" } So your loop is just going over that.
You could do an outer loop over the array
$.each(data.programs, function(index) {
// then loop over the object elements
$.each(data.programs[index], function(key, value) {
console.log(key + ": " + value);
}
}