Django、Ajax、Fotorama DB更新

Question

これまでのところ、Fotorama ImageスライダにDjango DBの画像スライダを追加しようとしていますが、これまでのところ幸運はありませんでした。 AJAX関数がインスペクタのコンソールで値を返すのを見ると、どのようにスライダを表示しても表示できないのですか？

これは、これは私のviews.py

class ImageBusqueda(generic.TemplateView): 

    def get(self, request, *args, **kwargs): 
     images = Images.objects.all() 
     data = serializers.serialize('json' ,images, fields= 
       ('imagen','nombre','duracion')) 
     return HttpResponse(data) 

であり、これは、これはHTML

<div class="fotorama" 
     data-nav="false" 
     data-shuffle="true" 
     data-autoplay="true" 
     data-arrows="false" 
     data-loop="true" 
     data-transition="dissolve" 
     data-fit="cover" 
     data-width="100%" 
     data-height="100%" 
    > 
{# NORMAL DJANGO WAY #} 
     {#  {% for img in imagenes %}#} 
     {#   <img src="{{ img.imagen.url }}" data-id="{{ img.id }}" >#} 
     {#  {% endfor %} #} 


     {# JS WAY #} 
     <div id="img"> 

     </div> 


    </div> 

ある

<script> 
    $(function() { 
     $('.fotorama') 


      .on('fotorama:show', function() { 

       $.ajax({ 
        url:'/image/busqueda/', 
        type:'get', 
        datatype:'json', 
        success : function(data){ 
         var img = "" 
         for(var i = 0; i<data.lenght; i ++){ 
          img += '<img src="' + data[i].fields.imagen + '"data-id="' + data[i].id + '">' 

         } 
         $('#img').html(img); 
        } 

       }); 

      }) 
</script> 

私のJSは私urls.py

url(r'image/busqueda/$', views.ImageBusqueda.as_view(), name='image-busqueda'), 

です

Answer 1

は、ループがあなたのモデルをシリアル化するためにここに最小限のですが、私のcomment上に構築するには、次の

import json 

class ImageBusqueda(generic.TemplateView): 

    def get(self, request, *args, **kwargs): 
     images = Images.objects.all() 

     data_list = [] 
     for image in queryset: 
      data_list.append({ 
       'imagen': image.imagen.url, 
       'nombre': image.nombre, 
       'duracion': image.duracion 
      }) 

     data = json.dumps(data_list) 
     return HttpResponse(data, content_type='application/json') 

---

注：1つのビューでそれを使用する必要がある場合は、手動でシリアライズオブジェクトのこのアプローチはかなり良いです。複数のビューで使用したい場合は、これをシリアライズ専用の別の関数に移動することをお勧めします。そうすれば、コードを何度も何度もコピーするのではなく、別のビューでアクセスすることができます。