tengo una funcion de ajax que obtiene los elementos de un abase de datos en django. puedo ver que la funcion trae los elementos en el inspector sinenbargo, no puedo crear el elemento en el div que necesito.
el resulatado de la funcion de ajax en el inspector:
[{nombre: "gato", imagen: "/media/1swGj9_7oxrYGA.jpg", duracion: "2000"},…]
0 : {nombre: "gato", imagen: "/media/1swGj9_7oxrYGA.jpg", duracion: "2000"}
1 : {nombre: "lay", imagen: "/media/layout_53hUG5g.png", duracion: "2000"}
2 : {nombre: "lol", imagen: "/media/IMG_194935_jkGCdbp.jpg", duracion: "2000"}
duracion :"2000"
imagen : "/media/IMG_194935_jkGCdbp.jpg"
nombre : "lol"
mi HTML
<div class="wrapper">
<ul class="bxslider" id="datos">
<!-- {% for img in imagenes %}
<li id="images">
<img src="{{ img.imagen.url }}" data-id="{{ img.id }}" >
</li>
{% endfor %} -->
</ul>
</div>
mi JS:
<script>
$('.bxslider').bxSlider({
onSliderLoad: function(){
// do funky JS stuff here
// alert('Slider has finished loading. Click OK to continue!');
console.log('<--------------------- se dispara el evento? ');
$.ajax({
url: '/image/busqueda',
type: 'get',
datatype: 'json',
success : function(data){
var html = ""
for(var i = 0 ; i < data.lenght; i ++){
html += '<li><img src="'+ data[i].fields.imagen + '" data-id="' + data[i].fields.id + '"/></li>';
}
$('#datos').html(html);
}
});
}