Tuesday, March 18, 2014

How to display the keys and values form json object

<!DOCTYPE html>
<html>
<body>

<table>
    <tbody id="tbody"></tbody>
</table>

<script>
var obj = [{    "key": "apple",    "value": 1.90},
                {    "key": "berry",    "value": 1.7},
                {    "key": "banana",   "value": 1.5},
                {    "key": "cherry",   "value": 1.2}
];

var globalCounter = 0;
var tbody = document.getElementById('tbody');
for (var i = 0; i < Object.keys(obj).length; i++) {
    var tr = "<tr>";
    if (obj[i].value.toString().substring(obj[i].value.toString().indexOf('.'), obj[i].value.toString().length) < 2) obj[i].value += "0";

    tr += "<td>" + obj[i].key + "</td>" + "<td>$" + obj[i].value.toString() + "</td></tr>";
    tbody.innerHTML += tr;
}
alert(object.keys(obj).length);  // To find the length of the array
</script>

</body>
</html>

No comments:

Post a Comment