2014-01-24 101 views
4

如何在提交表單上傳之前從Blueimp插件中的選定文件列表中刪除文件。我試過this SO answer,但它只是從UI中刪除文件而不是從隊列中刪除。Blueimp文件上傳:上傳前從文件列表中刪除文件

這裏是我的代碼

$(function(){ 
      $("#UploadPhotos").click(function(){ 
       $("#ItemPhotos").click(); 
      }); 
      $('#ItemPhotos').fileupload({ 
        url: "${pageContext.servletContext.contextPath}/XYZ", 
        //dataType: 'json', 
        autoUpload: false, 
        acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i, 
        maxFileSize: 5000000, // 5 MB 
        // Enable image resizing, except for Android and Opera, 
        // which actually support image resizing, but fail to 
        // send Blob objects via XHR requests: 
        disableImageResize: /Android(?!.*Chrome)|Opera/ 
         .test(window.navigator.userAgent), 
        previewMaxWidth: 171, 
        singleFileUploads:false, 
        previewMaxHeight: 180, 
        previewCrop: true 
       }).on('fileuploadadd', function (e, data) { 
        data.context = $('<div/>').appendTo('#FilesListThumb'); 
        $.each(data.files, function (index, file) { 
         var node = $('<div><h6>X</h6></div>').addClass("thumbnail-ib"); 
         node.appendTo(data.context); 
         node.find("h6").click(function(){ 
          node.remove(); 
         }); 
        }); 
        $("#itemSellForm").submit(function(){ 
         data.formData = $("#itemSellForm").serializeArray(); 
         data.submit(); 
         return false; 
        });       
       }).on('fileuploadprocessalways', function (e, data) { 
        var index = data.index, 
         file = data.files[index], 
         node = $(data.context.children()[index]); 
        if (file.preview) { 
         node 
          .addClass("thumbnail") 
          .append(file.preview); 
        } 
        if (file.error) { 
         node 
          .addClass("thumbnail") 
          .append($('<span class="text-danger"/>').text("Upload Failed")); 
        } 
       }).on('fileuploadfail', function (e, data) { 
        $.each(data.files, function (index, file) { 
         var error = $('<span class="text-danger"/>').text('File upload failed.'); 
         $(data.context.children()[index]) 
          .append('<br>') 
          .append(error); 
        }); 
       }).on("fileuploaddone",function(e,data){ 
        // sendData = false; 
       alert("done"); 
       }); 
     }); 

在這裏,當我點擊H6縮略圖從UI從ifles

回答

4

的列表中刪除唯一不是每個BlueImp回調有兩個參數:一個eventdata對象。

data對象包含一個files數組,您可以編輯它以更改將要上傳的文件。因此,如果您在提交請求之前刪除了其中一個數組元素(array.pop或其他方法...),則可以將其視爲刪除

+0

ü可以檢查我的更新問題 – manish

+2

哦,是的,它的工作我接着說:data.files.splice(指數,1);''裏面node.find( 「H6」)click' – manish

+0

要小心,我認爲當您刪除數組中間的一個對象時,data.files數組的索引將被重新計算。 – Fractaliste

0

也許還有助於單擊按鈕上傳照片以刪除/取消綁定事件。

$("#UploadPhotos").unbind("click") 
相關問題