¡Estoy tratando de recorrer mis datos, pero devuelve undefined para el primer ciclo! ¡Lo intenté de varias maneras pero aún no funcionó!
$.ajax({ type:'GET', url:'/categories', success:function(data){ var cates = data.data; console.log(cates) var my_div; $.each(cates,function(key,value){ console.log(value) var beds = value['beds'] console.log(beds) var f_type = value['f_type'] var room_type = value['room_type'] var total = value['total'] var balcon = value['balcon'] if(balcon==true){ balcon='True' }else{ balcon='False' } var link = '/rooms/'+f_type+'/'+room_type+'/'+beds+'/'+balcon; my_div+='<a href="'+link+'" class="transition transform cursor-pointer duration-400 hover:scale-105 hover:shadow-xl">'; my_div+='<div class="h-32 overflow-hidden rounded-tl-2xl rounded-tr-2xl room"></div>'; my_div+='<div class="items-center p-2 rounded-bl-xl rounded-br-xl bglightpurple">'; my_div+='<div class="text-center rounded-lg" style="background: #534e70;">'; my_div+='<p class="inline textorange "><i class="bi bi-columns-gap"></i></p>' my_div+='<p class="inline text-white">'+room_type+' - '+f_type+' - '+beds+ ' beds</p>'; my_div+='</div>'; my_div+='</div>'; my_div+='</a> '; }) document.getElementById('my_cates').innerHTML = my_div; }, error: function(){ } }) <div class="p-4 mt-3"> <div class="grid grid-cols-1 gap-6 pt-3 pt-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 " id="my_cates"> </div> </div> También traté de usar for(i=0;i<cates.length;i++) pero aún así devuelve lo mismo, ¿indefinido para el primer ciclo? hay algo que hice mal? gracias de antemano
simplemente colóquelo en una función y defina my_div como =="" funciona todo el código
function cates(){ var my_div = ""; $.ajax({ type:'GET', url:'/categories', success:function(data){ var cates = data.data; for(i=0;i<cates.length;i++){ var beds = cates[i]['beds'] var f_type = cates[i]['f_type'] var room_type = cates[i]['room_type'] var total = cates[i]['total'] var balcon = cates[i]['balcon'] if(balcon==true){ balcon='True' }else{ balcon='False' } var link = '/rooms/'+f_type+'/'+room_type+'/'+beds+'/'+balcon; my_div+='<a href="'+link+'" class="transition transform cursor-pointer duration-400 hover:scale-105 hover:shadow-xl">'; my_div+='<div class="h-32 overflow-hidden rounded-tl-2xl rounded-tr-2xl room"></div>'; my_div+='<div class="items-center p-2 rounded-bl-xl rounded-br-xl bglightpurple">'; my_div+='<div class="text-center rounded-lg" style="background: #534e70;">'; my_div+='<p class="inline textorange "><i class="bi bi-columns-gap"></i></p>' my_div+='<p class="inline text-white">'+room_type+' - '+f_type+' - '+beds+ '</p>'; my_div+='</div>'; my_div+='</div>'; my_div+='</a> '; } document.getElementById('my_cates').innerHTML = my_div; }, error: function(){ } }) } cates();