Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

139
Vistas
Convertir datos de Josn a tabla html

Estoy usando jsreport y quiero convertir datos json a una tabla html, pero no pude hacerlo. Estos son mis datos:

 { "items": [ { "order": "65854", "addr": "test 1", "city": "2fc2", "country": "2fc2" }, { "order": "75757", "addr": "azerty", "city": "2fc2", "country": "2fc2" }, { "order": "65575784", "addr": "tst", "city": "2fc2", "country": "2fc2" } ] }

Y este es mi código:

 <h1>Test</h1> <table class='table striped'> <thead> <tr> <th>OrderID</th> <th>ShipAddress</th> <th>ShipCity</th> <th>ShipCountry</th> </tr> </thead> <tbody> {{#each row}} <tr> <td>{{order}}</td> <td>{{addr}}</td> <td>{{city}}</td> <td>{{country}}</td> </tr> {{/each}} </tbody> </table> <script> for (let i=0; i<items.length; i++) { let row = items[i] } </script>

Creo que el problema está en {{#cada fila}} {{/cada}} y no se obtiene nada.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Hace una gran diferencia lo que dice el mensaje de error. (Por ejemplo, si le dice que cierta variable no existe, sabe que necesita declarar esa variable en el alcance donde se proporcionó el mensaje de error). Se acostumbrará a usar mensajes de error para depurar su código.

Por ahora, aquí hay una demostración de trabajo (usando Vanilla JS) que hace algo muy similar a lo que estás tratando de hacer. Dos cuestiones resueltas aquí son:

  • Es posible que no obtenga la propiedad de items (una matriz) de su objeto JSON antes de intentar recorrerlo (tal vez se muestra en su primer mensaje de error)
  • Usas var para declarar un contador de bucle for, una trampa clásica

 const inputObject = { "items": [ {id: 1}, {id: 2}, {id: 3} ] }, items = inputObject.items, // Gets the `items` array TRs = document.querySelector("tbody").children; // (For demo) for (let i = 0; i < items.length; i++) { // Uses `let`, not `var` const row = items[i], TD = TRs[i].children[0]; // Gets first td in table row TD.textContent = row.id; }
 <table class='table striped'> <thead> <tr> <th>OrderID</th> </tr> </thead> <tbody> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> </tbody> </table>

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda