Django中的Dropzone

时间:2014-10-01 14:18:14

标签: django dropzone.js

我在django项目中使用Dropzone插件。

我想点击按钮时上传图片。这件事有效。但问题是我想在服务器上成功上传所有文件后触发事件。我通过谷歌搜索尝试了许多解决方案但没有任何作用。

这是我的代码: 的 HTML

<div id="dropzone-div">
  <form class = "dropzone" id = "image-form">
    {% csrf_token %}
    <div class="dropzone-previews"></div>
    <input type = "text" name = "album_Id" id = "album_Id" hidden>
    <div class="fallback">
      <input name="image_file" type="file" multiple="" />
    </div>
    <input type = "reset" id ="resetImageForm" hidden>
  </form>
</div>

<span>
  <button class="btn btn-success" id = "upload">Upload</button>
</span>

js代码:

Dropzone.autoDiscover = false;

var myDropzone = new Dropzone(".dropzone", {
  url: "{% url 'upload' %}",
  addRemoveLinks: true,
  thumbnailWidth: "80",
  thumbnailHeight: "80",
  dictCancelUpload: "Cancel",
  parallelUploads: 100,
  autoProcessQueue: false
});

myDropzone.on("drop", function (event) {
  $('.dropzone').animate({
    opacity: 1,
    top: "-5"
  });
});

$("#upload").on('click', function () {
  myDropzone.processQueue();
  $.ajax({
    type: "POST",
    url: "{% url 'getPhoto' %}",
    dataType: "json",
    async: true,
    data: {
      album_Id_1:$("#album_Id").val()
    },
    success: function (json_data) {
      alert(json_data)
    }
  });

});

views.py代码:

#module for uploading images
@csrf_exempt
def uploadImages(request):
    try:
        if request.session['member_id'] is not None:
            if request.method == "POST":
                album_Id = request.POST.get('album_Id','')
                files = request.FILES.getlist('file')
                for filename in files:
                    save_image = AlbumPhotos(photo=filename, albumPhoto_id=album_Id)
                    save_image.save()

                data = {'status':'true'}
                return HttpResponse(json.dumps(data), content_type="application/json")

    except KeyError:
        pass
    return redirect('/')


#module for counting photos in current album
@csrf_exempt
def getPhotoCount(request):

        if request.session['member_id'] is not None:
            if request.method == "POST":
                response = {}
                album_Id = request.POST.get('album_Id_1','')
                countPhotos = AlbumPhotos.objects.filter(albumPhoto_id=album_Id).count()
                print("_______",countPhotos)
                response['count'] = countPhotos
                return HttpResponse(json.dumps(response), content_type="application/json")

    #except KeyError:
     #   pass
    #return redirect('/')

事情是所有文件都成功上传。但我想计算上传的文件数量。为此,我想在服务器上传所有文件时触发另一个功能。如何解决这个问题。请回答。

1 个答案:

答案 0 :(得分:1)

为此使用变量并在每个成功上传的文件

上更新它
    var myDropzone = new Dropzone(".dropzone", {
    [...] // all the other settings
    uploadedFile: 0,
    });

    myDropzone.on("success", function (event) {
       this.uploadedFile++;
    });