1

Tengo este código HTML para consumir JSON mediante ajax, pero no me muestra los datos que quiero traer.

¿Me podrían decir que estoy haciendo mal?

El url del JSON es este: http://www.mocky.io/v2/5a5502052d0000f43a5b1e60*

Este es el script que esto usando:

<div class="panel-heading">Programa</div>
<div class="panel-body" id="programas"></div>

<script type="text/javascript">
    $(function () 
    {
         $.ajax({
             url: 'http://www.mocky.io/v2/5a5502052d0000f43a5b1e60',
             type: 'GET',
             dataType: 'JSON',
             success: function (data) 
             {
                 var program = "<ul>";
                 for (var c = 0; c < data.length; c++) {
                     var infoprograma = "<li>" + "Programa: "+  data[c].programa[0].programa;
                     infoprograma += "Sinopsis: " + data[c].programa[0].sinopsis;
                     infoprograma += "Conductor: " + data[c].programa[0].conductor;
                     infoprograma += "Clasificacion: " + data[c].programa[0].clasificacion;
                     infoprograma += " <em>" + data[c].programa[0].tipoProgram + "</em> </li>";
                     program += infoprograma; 
                 }
                 program += "</ul>";
                 $("#programas").html(infoprograma);
             }
             })
    });
</script>

Cuando doy a Network > Preview me muestra objeto que estoy llamando, pero en el div no me muestra nada.

introducir la descripción de la imagen aquí

2
  • Bienvenido a StackOverflow Mateo! Para poder darte una mano con el problema deberías especificar si estás teniendo un error y especificarlo. en el caso de que no veas el error, prueba haciendo un console.log(data), para que que te devuelve la llamada. el 9 ene. 2018 a las 18:23
  • ningún erro pero cuando boy a Network, preview me muestra el json que estoy llamando. el 9 ene. 2018 a las 18:31

1 respuesta 1

2

El problema es que data es un objeto y lo estas intentando iterar mediante data.length. Dicha propiedad no existe por lo que es igual a undefined. Lo que necesitas iterar es la propiedad programa.

Solución:

El for deberías hacerlo sobre data.programa.length y acceder a los datos del programa usando data.programa[c].*

Ejemplo:

success: function(data) {
  var program = "<ul>";
  for (var c = 0; c < data.programa.length; c++) {
    var infoprograma = "<li>" + "Programa: " + data.programa[c].programa;
    infoprograma += "Sinopsis: " + data.programa[c].sinopsis;
    infoprograma += "Conductor: " + data.programa[c].conductor;
    infoprograma += "Clasificacion: " + data.programa[c].clasificacion;
    infoprograma += " <em>" + data.programa[c].tipoProgram + "</em> </li>";
    program += infoprograma;
  }
  program += "</ul>";
  $("#programas").html(infoprograma);
}
1

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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