Отключение автоматического скачивания на Blueimp JQuery Файл Загрузить

Question

Я использую blueint jquery.fileupload плагин для загрузки файлов с помощью asp.net

У меня есть ситуации, когда у меня есть страницы, чтобы позволить пользователю выбрать категорию (dropdownlistbox), заголовок (для загруженного файла - TextBox) и ввод файла (обрабатываемый плагином).

плагин: https://github.com/i-e-b/jQueryFileUpload.Net

JavaScript/JQuery:

$('#fileup').fileupload({ 
        replaceFileInput: false, 
        formData: function (form) { 
         return [{ name: 'dcat', value: $('#ddlCats').val() }, { name: 'title', value: $('#txtTitle').val()}]; 
        }, 
        dataType: 'json', 
        url: '/_handlers/FileHandler.ashx', 
        add: function (e, data) { 
         var valid = true; 
         var re = /^.+\.((doc)|(xls)|(xlsx)|(docx)|(pdf)|(pts))$/i; 
         $.each(data.files, function (index, file) { 
          if (!re.test(file.name)) { 
           $('#uploaded').html('This file type is not supported'); 
           valid = false; 
          } 
         }); 
         if (valid) 
          data.submit(); 
        }, 
        done: function (e, data) { 
         $.each(data.result, function (index, file) { 
          $('#uploaded').html(file); 
         }); 
         GetFiles($('#ddlCats').val()) 
        }, 
        error: function() { 
         alert('An error occured while uploading the document.'); 
        } 
       }); 

HTML:

<div id="fUpload"> 
<span style="font-weight:bold;">Yeni Belge:</span><br /> 
    <table class="ktoeos"> 
     <tr> 
      <td>Category:</td> 
      <td> <select id="ddlCats"></select></td> 
     </tr> 
     <tr> 
      <td>Document Description:</td> 
      <td><input type="text" id="txtTitle" /></td> 
     </tr> 
     <tr> 
      <td>Select Document:</td> 
      <td><input type="file" name="file" id="fileup" /></td> 
     </tr> 
     <tr> 
      <td colspan="2"><input type="submit" id="btnSubmit" value="Upload" /></td> 
     </tr> 
    </table> 
    <div id="uploaded"></div> 

Моя проблема, файл получает загружены (через обработчик HTTP) сразу после того, как я выберите файл. Я могу обработать его, чтобы отправить другие данные формы вместе с ним, однако, я хочу запустить это событие на кнопку submit, поскольку мне нужно выполнить некоторую проверку. Также пользователь может сначала выбрать файл, а затем заполнить другие части формы, которые в этом случае он/она не может сделать, из-за формы, которая будет представлена ​​до того, как он сможет это сделать.

Поскольку я не очень хороший javascript-программист, я понятия не имею, доступна ли эта функциональность (которая, вероятно, есть) в файлах .js, доступных с помощью плагина. Любые идеи, что мне нужно изменить или сделать?

Answer 1

Это очень легко сделать, так как есть вариант " autoUpload: true", который устанавливается по умолчанию в jquery.fileupload-ui.js

Если вы измените его false и вручную можно код на кнопку Click события.

Answer 2

Обратный вызов add вызывается, как только файлы добавляются в виджет, поэтому вам необходимо переопределить его, чтобы приостановить загрузку, а затем запустить его нажатием кнопки.

add: function (e, data) { 
    $("#btnSubmit").click(function() { 
     // validate file... 
     if(valid) 
      data.submit(); 
    }); 
} 

Update: В документации есть better example этого прямо сейчас: