desactivación automática de la carga en Blueimp jQuery File Cargar

Question

estoy usando el plugin de jquery.fileupload blueint para subir archivos utilizando asp.net

Tengo una situación donde tengo una página para permitir que el usuario seleccione una categoría (DropDownListBox), un título (para el archivo cargado - TextBox) y una entrada de archivo (manejada por el complemento).

el plugin: 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> 

es decir, el archivo se ha subido Mi problema (a través de un controlador HTTP) inmediatamente después de que seleccione un archivo. Puedo manejarlo para enviar otros datos de formulario junto con él, sin embargo, deseo activar este evento en el botón enviar ya que necesito llevar a cabo alguna validación. También es posible que el usuario desee seleccionar primero un archivo y luego completar las otras partes del formulario, que en este caso no puede hacerlo, debido a que el formulario se envió antes de que él o ella pueda hacerlo.

Dado que no soy un programador de javascript muy bueno, no tengo idea si esta funcionalidad ya está disponible (que probablemente lo es) en los archivos .js disponibles con el complemento. ¿Alguna idea de lo que necesito cambiar o hacer?

Answer 1

Esto es muy fácil de hacer, ya que es una opción " autoUpload: true" que se establece como predeterminado en el jquery.fileupload-ui.js

Si lo cambia a false y usted puede manualmente código en el evento de clic de botón.

Answer 2

La devolución de llamada add se invoca tan pronto como se agregan archivos al widget, por lo que debe sobrescribirlo para pausar la carga y luego iniciarlo con un clic de botón.

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

Actualización: La documentación tiene un better example de esto ahora: