動態更新Dropzone maxFiles設置

Dropzone.options.dropzone = { 
    uploadMultiple: false, 
    maxFiles: {{ imagecount }}, 
    maxFilesize: 2, // MB 
    dictFileTooBig: "That image is too large. We only allow 2MB or smaller.", 
    acceptedFiles: ".jpeg, .jpg", 
    init: function() { 
     this.on("success", function(file, response) { 
      $('.uploaded-photos').append('<div><img src="' + response.link + '"height="150" class="photo" id="' + response.id + '"/><span class="delete-photo">Delete</span></div>'); 
      $('.uploaded-photos').justifiedGallery('norewind') 
      this.removeFile(file); 

      var grabNewCount = parseInt($('.recordcount').text(), 10) 
      $('.recordcount span').text(grabNewCount += 1); 
      }); 
    } 
};

我想在每次上傳/刪除一張新圖像時動態更新MaxFiles屬性。動態更新Dropzone maxFiles設置

正如您所看到的，當頁面加載時，我從我的服務器傳遞{{ imagecount }}。這只是一個檢查，看看有多少圖像已經上傳給用戶，因此計算他們有多少上傳。在首頁加載時，這是有效的。

這個問題似乎出現時，我刪除了我使用AJAX做的圖像。我似乎無法獲得更新的maxFiles值。如果我最初允許10個圖像，並且用戶有5個當前上傳並刪除了一個，那麼新的maxFiles值現在應該是6，但我做的任何事情似乎都不會動態更新該值。下面是我對我的刪除代碼：

$('.delete-photo').click(function() { 
    $(this).text('') // remove "delete" text from button 
    $(this).html('<i class="fa fa-spinner fa-spin"></i>') // add spinning icon to indicate "working" 

    var csrf = $('[name=csrfmiddlewaretoken]').val(); 
    $.ajax({ 
     context: this, 
     type: "POST", 
     url: '/delete-photo/', 
     data: {'csrfmiddlewaretoken': csrf, 'id': $(this).parent().attr('id') }, 
     dataType: "json", 
     timeout: 10000, 
     cache: false, 
     success: function(data, textStatus, XMLHttpRequest){ 
      var image = $(this).parent(); 
      $(image).fadeOut(800, function() { 
       $(this).remove(); 
       $('.uploaded-photos').justifiedGallery() 
      }); 
      Dropzone.options.dropzone.maxFiles = Dropzone.options.dropzone.maxFiles + 1; 
      var grabNewCount = parseInt($('.recordcount').text(), 10) 
      $('.recordcount span').text(grabNewCount -= 1); 
        } 
    }); 
});

所以你可以看到，我已經得到Dropzone.options.dropzone.maxFiles = Dropzone.options.dropzone.maxFiles + 1;企圖利用目前的MAXFILES值和更新值+1，但這並不做任何事情。

任何想法？

來源

2017-03-08 lexbuckeye

因此，我通過向表單標籤添加數據屬性並每次刪除或上傳新圖像時使用新數字更新該屬性來實現此目的。

我的服務器端代碼通過初步MAXFILES（{{imagecount}}標籤）計數返回頁面負載：

<form data-count="{{ imagecount }}">

所以我開懸浮窗的代碼如下所示：

var maxFiles = $('.dropzone').attr('data-count'); Dropzone.options.dropzone = { uploadMultiple: false, maxFiles: maxFiles, 我有：

var imagecount = $('.dropzone').attr('data-count'); imagecount = imagecount - 1; $('.dropzone').attr('data-count', imagecount);

和刪除AJAX功能裏面我有：

var imagecount = $('.dropzone').attr('data-count'); imagecount = imagecount + 1; $('.dropzone').attr('data-count', imagecount);

來源

2017-03-11 01:26:44 lexbuckeye

動態更新Dropzone maxFiles設置

回答

相關問題