Skip to content
Advertisement

Javascript JSON with internal array

I have a JSON with internal arrays:

{
    "configurable": true,
    "esquema": {
        "no_abono": [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15],
        "id_unico": ["60a41a721e028", "60a41a721e04f", "60a41a721e05f", "60a41a721e06b", "60a41a721e076", "60a41a721e081", "60a41a721e08c", "60a41a721e098", "60a41a721e0a4", "60a41a721e0b0", "60a41a721e0bb", "60a41a721e0c6", "60a41a721e0d2", "60a41a721e0dd", "60a41a721e0e8"],
        "dia_semana": ["Monday", "Wednesday", "Friday", "Sunday", "Tuesday", "Thursday", "Saturday", "Monday", "Wednesday", "Friday", "Sunday", "Tuesday", "Thursday", "Saturday", "Monday"],
        "fecha": ["2021-05-17", "2021-05-19", "2021-05-21", "2021-05-23", "2021-05-25", "2021-05-27", "2021-05-29", "2021-05-31", "2021-06-02", "2021-06-04", "2021-06-06", "2021-06-08", "2021-06-10", "2021-06-12", "2021-06-14"],
        "abono": [80, 80, 80, 80, 80, 80, 80, 80, 80, 80, 80, 80, 80, 80, 80],
        "remanente": [1040, 960, 880, 800, 720, 640, 560, 480, 400, 320, 240, 160, 80, 0, -80]
    }
}

My code to write the table is:

var tabla = '';
for (i in resultado.esquema) {
  tabla += '<tr>';
  tabla += '<td>' + resultado.esquema["no_abono"][i] + '</td>';
  tabla += '<td>' + resultado.esquema["id_unico"][i] + '</td>';
  tabla += '<td>' + resultado.esquema["fecha"][i] + '</td>';
  tabla += '<td>' + resultado.esquema["dia_semana"][i] + '</td>';
  tabla += '<td>' + resultado.esquema["remanente"][i] + '</td>';
  tabla += '<td>' + resultado.esquema["abono"][i] + '</td>';
  tabla += '</tr>';
}
$('#tbl_abonos_prestamo').append(tabla);

But always run as undefined

Tabla

How to get internals values in array?

Advertisement

Answer

You could make things easier by pre-processing the data and making an array of objects with all properties (rows). Then, creating your table will become simpler:

var resultado = {"configurable":true,"esquema":{"no_abono":[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15],"id_unico":["60a41a721e028","60a41a721e04f","60a41a721e05f","60a41a721e06b","60a41a721e076","60a41a721e081","60a41a721e08c","60a41a721e098","60a41a721e0a4","60a41a721e0b0","60a41a721e0bb","60a41a721e0c6","60a41a721e0d2","60a41a721e0dd","60a41a721e0e8"],"dia_semana":["Monday","Wednesday","Friday","Sunday","Tuesday","Thursday","Saturday","Monday","Wednesday","Friday","Sunday","Tuesday","Thursday","Saturday","Monday"],"fecha":["2021-05-17","2021-05-19","2021-05-21","2021-05-23","2021-05-25","2021-05-27","2021-05-29","2021-05-31","2021-06-02","2021-06-04","2021-06-06","2021-06-08","2021-06-10","2021-06-12","2021-06-14"],"abono":[80,80,80,80,80,80,80,80,80,80,80,80,80,80,80],"remanente":[1040,960,880,800,720,640,560,480,400,320,240,160,80,0,-80]}};

var rows = resultado.esquema.no_abono.map(
  (_, i) => Object.fromEntries(
    Object.entries(resultado.esquema).map(([k, v]) => [k, v[i]])
  )
);

var tabla = rows.map(row => `
<tr>
  <td>${row.no_abono}</td>
  <td>${row.id_unico}</td>
  <td>${row.fecha}</td>
  <td>${row.dia_semana}</td>
  <td>${row.remanente}</td>
  <td>${row.abono}</td>
</tr>
`).join('');

console.log(tabla);
2 People found this is helpful
Advertisement