I'm having trouble with this code as it only retrieves the first data from the JSON and then stops processing. I've tried simplifying it by starting over, but I can't seem to figure out what's missing. It feels like there's a simple mistake that I'm overlooking. For instance, I have removed the meta, ref, and jQuery elements for clarity.
<html>
<head>
</head>
<body>
<table class="table table-striped">
<tr class="bg-info">
<th>User</th>
<th>Name</th>
<th>OS</th>
<th>SN</th>
</tr>
<tbody id="myTable">
</tbody>
</table>
<script>
const jsonData2 = {
"result": [{
"data": [{
"user": "admin",
"name": "Frank Admin",
"OS": "Windows",
"sn": "yadayoda123"
}, {
"user": "root",
"name": "john root",
"OS": "OS/2",
"sn": "123-A"
}]
}]
}
</script>
<script>
buildTable(jsonData2)
function buildTable(data2) {
var table = document.getElementById('myTable')
for (var i = 0; i < name.length; i++) {
}
Object.entries(data2.result).forEach(([name, details]) => {
console.log("gotname?", details.data[i]);
console.log("whats i", i);
var row = `<tr>
<td>${details.data[i].name}</td>
<td>${details.data[i].user}</td>
<td>${details.data[i].os}</td>
<td>${details.data[i].sn}</td>
</tr>`
table.innerHTML += row
});
};
</script>
</body>
</html