Dropzone:绑定到init

时间:2015-05-11 01:39:28

标签: javascript file-upload javascript-events dropzone.js

我正在关注this tutorial将现有文件模拟为支持Dropzone的表单,但是我无法连接到init函数。这是我到目前为止所做的:

var imageUpload;

if ($('.js-listing__images-upload').length) {
  imageUpload = new Dropzone('.js-listing__images-upload', {
    addRemoveLinks: true,
    maxFiles: 5,
    maxFilesize: 3,
    acceptedFiles: 'image/jpeg,image/png,image/gif'
  });
  imageUpload.on('init', function() {
    var listingID, thisDropzone;
    console.log('dropzone init');
    thisDropzone = this;
    listingID = $('#manage-images').data('listing');
    $.ajax({
      url: dashboard.images.list,
      data: {
        listing: listingID
      },
      success: function(data) {
        console.log('ajax for list done');
        $.each(data, function(key, value) {
          var mockFile;
          mockFile = {
            name: value.name,
            size: value.size
          };
          thisDropzone.options.addedfile.call(thisDropzone, mockFile);
          thisDropzone.options.thumbnail.call(thisDropzone, mockFile, '/uploads/thumb/listings/' + value.name);
        });
      }
    });
  });
}

我的console.log()没有一个人开火,但我不确定问题是什么。在Dropzone的配置之后,我应该能够使用简单的on机制挂钩事件。谢谢大家!

更新

以下工作正常:

# When images are removed
# Dropzone
imageUpload.on 'removedfile', (file) ->
  if file.xhr
    imageID = JSON.parse file.xhr.response
    $.ajax
      url: dashboard.images.destroy
      data: { image: imageID }
      success: () ->
  return

所以我遇到了init函数问题。

1 个答案:

答案 0 :(得分:0)

init函数可以直接绑定到新的Dropzone实例:

if $('.js-listing__images-upload').length
  imageUpload = new Dropzone(
    '.js-listing__images-upload',
    addRemoveLinks: true
    maxFiles: 5
    maxFilesize: 3
    acceptedFiles: 'image/jpeg,image/png,image/gif'
    init: ->
      thisDropzone = this
      $.ajax
        url: dashboard.images.list
        data: { listing: $('#manage-images').data('listing') }
        success: (data) ->
          $.each data, (key, value) ->
            mockFile =
              name: value.name
              size: value.size
            thisDropzone.options.addedfile.call thisDropzone, mockFile
            thisDropzone.options.thumbnail.call thisDropzone, mockFile, '/uploads/thumb/listings/' + value.name
            return
          return
      return
  )