3

Tengo el siguiente problema, hago una consulta AJAX que me devuelve un JSON con unos horarios, se dividen en Laborables, Sábados y Domingos. La cosa es que los recibo perfectos pero al intentar hacer un append recorro el JSON y claro los días laborables tienen mas rutas que los fines de semana, en toces al recorrerlo no encuentra la propiedad hora

este es el JSON que recibo "variable result"

{
   "labo":[
      {
         "hora":"7.35"
      },
      {
         "hora":"9.10"
      },
      {
         "hora":"10.30"
      },
      {
         "hora":"11.15"
      },
      {
         "hora":"12.30"
      },
      {
         "hora":"13.30"
      },
      {
         "hora":"14.30"
      },
      {
         "hora":"17.30"
      },
      {
         "hora":"19.15"
      },
      {
         "hora":"21.30 "
      }
   ],
   "sab":[
      {
         "hora":"10.30"
      },
      {
         "hora":"12.30"
      },
      {
         "hora":"13.30"
      },
      {
         "hora":"14.30"
      },
      {
         "hora":"19.00"
      },
      {
         "hora":"21.30"
      }
   ],
   "dom":[
      {
         "hora":"10.30"
      },
      {
         "hora":"12.30"
      },
      {
         "hora":"19.00"
      },
      {
         "hora":"21.30"
      }
   ]
}

y así es como lo intento pintar

result={
  "labo":[{"hora":"7.35"},{"hora":"9.10"},{"hora":"10.30"},{"hora":"11.15"},{"hora":"12.30"},{"hora":"13.30"},{"hora":"14.30"},{"hora":"17.30"},{"hora":"19.15"},{"hora":"21.30 "}],
  "sab":[{"hora":"10.30"},{"hora":"12.30"},{"hora":"13.30"},{"hora":"14.30"},{"hora":"19.00"},{"hora":"21.30"}],
  "dom":[{"hora":"10.30"},{"hora":"12.30"},{"hora":"19.00"},{"hora":"21.30"}]
}
       
for(var c = 0; c < result.labo.length; c++) {

    var tabla= '<tr><td>'+ result.labo[c].hora+'</td>'
    if (result.sab[c].hora.length){
        tabla+='</td><td>' + result.sab[c].hora + '</td>'
    }else {
        tabla+='</td><td></td>'
    }
    if (result.dom[c].hora.length){
        tabla+='</td><td>' + result.dom[c].hora + '</td>'
    }else {
        tabla+='</td><td></td>'
    }
    tabla+='</tr>'
    $("#filas").append(tabla)

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody id="filas">
  </tbody>
</table>

como podeis comprobar con el snippet solo me pinta hasta que falla la hora, simplemente quiero hacer como en php un

 if(isset(result.sab[c].hora)){
        "que pinte el horario"
}else{
        "que pinte el td vacio o con un mensaje"
}

Gracias de antemano

3
  • @PabloLozano exactamente la misma pregunta...... xd
    – KeTeMeTo
    Commented el 1 ago. 2019 a las 15:33
  • Tienes un error por intentar acceder a una propiedad de un objeto inexistente, es equivalente a un null pointer exception en Java, por ejemplo. Todas las veces que te ocurra ese error, se soluciona del mismo modo Commented el 1 ago. 2019 a las 15:34
  • @PabloLozano muchas gracias, ya me lo soluciono el compañero en la respuesta, el error se cual es en php lo soluciono con if(isset(variable)) pero en java no tenia ni idea como se hacia, he leido lo del variable.length pero no me funcionaba y ya me ofusque. Muchas gracias por contestar!
    – KeTeMeTo
    Commented el 1 ago. 2019 a las 15:38

1 respuesta 1

4

Solo tienes que verificar si existe el elemento antes de accesar la hora asi:

result={"labo":[{"hora":"7.35"},{"hora":"9.10"},{"hora":"10.30"},{"hora":"11.15"},{"hora":"12.30"},{"hora":"13.30"},{"hora":"14.30"},{"hora":"17.30"},{"hora":"19.15"},{"hora":"21.30 "}],"sab":[{"hora":"10.30"},{"hora":"12.30"},{"hora":"13.30"},{"hora":"14.30"},{"hora":"19.00"},{"hora":"21.30"}],"dom":[{"hora":"10.30"},{"hora":"12.30"},{"hora":"19.00"},{"hora":"21.30"}]}
       
       for(var c = 0; c < result.labo.length; c++) {

            var tabla= '<tr><td>'+ result.labo[c].hora+'</td>'
            if (result.sab[c] && result.sab[c].hora.length){
                tabla+='</td><td>' + result.sab[c].hora + '</td>'
            }else {
                tabla+='</td><td></td>'
            }
            if (result.dom[c] && result.dom[c].hora.length){
                tabla+='</td><td>' + result.dom[c].hora + '</td>'
            }else {
                tabla+='</td><td></td>'
            }
            tabla+='</tr>'
            $("#filas").append(tabla)

        }
table td{
  border: 1px solid black;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody id="filas">
  </tbody>
</table>

2
  • 1
    Perfecto muchas gracias! no sabia como se hacia en jquery
    – KeTeMeTo
    Commented el 1 ago. 2019 a las 15:21
  • 1
    El lenguaje es Javascript, jQuery sólo lo usas en la última línea (la llamada a $) Commented el 1 ago. 2019 a las 15:44

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.