1

Estoy consumiento una api y al momento de trear el los objetos , me los trae como undefined usando un ajax quiero que me muestre los nombres de esos arreglos

    $.ajax({
        
        'url':"https://dog.ceo/api/breeds/list/all",
        'type':'GET',
        dataType:"json",
        success:function(response){
            
            console.log(response.message)
                                       
                 let todaslasrazas='';
                $.each(response.message,function(index,value){     
                    
                    todaslasrazas+="<li>"+value.message+"</li>";
            })     
            $("#listarazas").html(todaslasrazas)
        }
    })
   }

mi html es cual quiero que muestre los nombres posteriormente en un combo box

    <ul id="listarazas">
        <li>Razas</li>
        <li> <div id="listarazas"></div></li>
    
    </ul>

1 respuesta 1

1

El primer argumento del callback del $.each no es index, es el key, porque lo que estás recorriendo es un objeto. Ese key es el que contiene las razas. Usa ese valor para tus li.

Te adjunto un ejemplo que puedes testear acá:

$.ajax({
    'url': "https://dog.ceo/api/breeds/list/all",
    'type': 'GET',
    dataType: "json",
    success: function (response) {
        var todaslasrazas = "";
        $.each(response.message, function (key, value) {
            todaslasrazas += "<li>" + key + "</li>";
        })
        $("#listarazas").html(todaslasrazas)
    }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<h1>Razas</h1>
<ul id="listarazas"></ul>

No sé exactamente el tipo de combo box que planeas usar, pero acá te dejo un ejemplo con un select nativo de javascript:

$.ajax({
    'url': "https://dog.ceo/api/breeds/list/all",
    'type': 'GET',
    dataType: "json",
    success: function (response) {
        var todaslasrazas = "";
        $.each(response.message, function (key, value) {
            todaslasrazas += `<option value="${key}">${key}</option>`;
        })
        $("#listarazas").html(todaslasrazas)
    }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<label for="listarazas"> Seleccione la raza: </label>
<select id="listarazas"></select>

1
  • gracias amigo me funcione impecable ahora podre seguir con el ejercicio (y) Commented el 16 jun. 2022 a las 2:03

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

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