Blueimp文件上传:上传之前从文件列表中删除文件 [英] Blueimp File Upload: Remove a file from file list before upload

问题描述

在提交要上传的表单之前，如何从Blueimp插件的选定文件列表中删除文件.我尝试了 这个答案 ，但是它只是从UI中删除文件，而不是从队列中删除.

How can I remove a file from the selected files list in Blueimp plugins before submitting the form to upload. I tried this SO answer but its just remove file from UI not from queue.

这是我的代码

$(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列表中删除

here when I click h6 thumbnail is removed from ui only not from the list of ifles

推荐答案

每个BlueImp回调都有2个参数:event和data对象.

Every BlueImp callback have 2 parameters: an event and a data object.

data对象包含一个files数组，您可以对其进行编辑以更改将要上载的文件.因此，如果在提交请求之前删除了这些数组元素之一(array.pop或其他方法...)，则可以将其视为已删除 .

The data object contains a files array which you can edit in order to alter files that will be uploaded. So if you delete one of these array elements (array.pop, or other methods...) before submitting your request, it can be considered as removed.

这篇关于Blueimp文件上传:上传之前从文件列表中删除文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！