blueimp jquery-file-upload如何在上傳前取消1個文件

Question

我正在使用以下庫https://github.com/blueimp/jQuery-File-Upload/wiki

選擇（添加文件）按鈕后，我將顯示所選文件。 我沒有顯示演示網格顯示取消按鈕或上傳

我有一個按鈕可以提交（請參閱下文）。 在選擇此上傳按鈕之前，我想取消所選文件之一的上傳。

遍歷代碼，我看到當我最終點擊提交時，它將為每個上傳的文件調用fileuploadsubmit。

我想向用戶顯示所選文件的網格，然后允許他們通過選擇要從數據中刪除的鏈接來取消其中的一個。 我在網上找到的所有樣本都趨向於parent（）。remove（），從而從視覺網格中刪除。

不顯示該網格怎么辦？

即..

                ...
                add: function (e, data) {

                $.each(data.files, function (index, file) {
                    files += file.name;
                });
                $('#files').text(files);

                viewModel.Add(data);

                data.context = $('#btnUpload')
                    .click(function () {
                        data.submit();
                        return false;
                    });
            },
            ......


            $('#fileupload').bind('fileuploadsubmit', function (e, data) {
            // The example input, doesn't have to be part of the upload form:
            //var input = $('#input');
            //data.formData = {example: input.val()};

            var countryId = 1; //viewModel.selectedCountry().CountryId()
            var selected = 'test'; //$('#lstTemplate option:selected').text();

            data.formData = { templateType: selected, countryId: countryId };
            if (data.formData.templateType == 'Select') {
                data.context.find('button').prop('disabled', false);
                return false;
            }
        });

Answer 1

實際上可以從data.files中刪除一個文件。 我正在使用KnockoutJs Web組件，其中存儲“上載對象”的實例，並且具有文件列表的可觀察數組...

我的配置是：

.fileupload({
            url: DataServiceBaseUrl + '/api/Ruleset/BatchImport',
            dataType: 'json',
            singleFileUploads: false,
            replaceFileInput: false,
            add: function (e, data) {
...

我所做的是

this.RemoveFile = function(index){
   this.UploadInstance.files.splice(index,1);
   this.UploadFiles.splice(index,1);
}

模板是：

 <!-- ko foreach: UploadFiles -->
    <div><span data-bind="text: name"></span><button data-bind="click: function() { $component.RemoveFile($index()); }">delete</button></div>
 <!-- /ko -->