Comment empêcher la soumission d'un formulaire avant l'affichage de la barre de progression

Question

J'utilise Uploadify pour une application en temps réel et jusqu'à présent, son fonctionnement est correct, sauf pour ce problème. J'ai 6 boutons Parcourir pour télécharger 6 fichiers (avec multi - 'vrai' pour chacun) et j'ai aussi un bouton de soumission sur ma page (JSP).

Si l'utilisateur sélectionne un fichier sur l'un de ces boutons Parcourir, il y a un léger délai avant que la barre de progression ne s'affiche après la sélection du fichier. En attendant, si l'utilisateur clique sur le bouton Soumettre, le formulaire est soumis avant même que la barre de progression ne s'affiche et qu'aucun fichier ne soit téléchargé. J'ai regardé les méthodes disponibles mais pas encore capable de trouver une solution.

J'apprécie hautement et j'attends avec impatience toute aide à ce sujet.

Merci.

S'il vous plaît trouver mon code ci-dessous:

$("#vehShortTestAttachment1").uploadify({ 
     'uploader' : '../pts/swf/uploadify.swf', 
     'script' : url, 
     'cancelImg' : '../pts/images/cancel.png', 
     'wmode'  : 'transparent', 
     'hideButton': 'true', 
     'width'  : 67, 
     'height' : 20, 
     'multi'  : true, 
     'sizeLimit' : 20971520, 
     'fileDesc' : 'jpg, gif, doc, ppt, jpeg, txt, pdf', 
     'fileExt' : '*.jpg;*.gif;*.doc;*.ppt;*.jpeg;*.txt;*.pdf', 
     'onCancel': function() { 
      $('#attachments-div-validation').html(""); 
      isFileBig = false; 
     }, 
     'onSelectOnce': function (event, queueID, fileObj) {   
      $("#attachments-submit-case-button").attr("disabled", true); 
     }, 
     'onSelect': function (event, queueID, fileObj) {   

       $("#attachments-div-validation").html(div_validation_red_start + "<B>You can select other files (or) Submit the Case now.</B>" + div_validation_red_end); 
      $("#attachments-div-validation").show(); 

      if (fileObj.size > 20971520) 
      {    
       $('#attachments-div-validation').html(div_validation_red_start + "Size of the file: " + fileObj.name + " exceeds 20MB and this file can not be uploaded. <br>Please click on the X button on the progress bar for this file to cancel the upload. <br>Please click on BROWSE button again to upload another file." + div_validation_red_end); 
       $('#attachments-div-validation').show();  
       isFileBig = true;          
      } 
     }, 
     'onComplete': function(event, queueID, fileObj, response, data) 
     {        
      if(response == 'OK') { 
       $('input[name=fileUploadStatus]').val(response); 
       $("#vehShortTestAttachment1").uploadifySettings('script', url); 
      } 
      else { 
       $('input[name=fileUploadStatus]').val(response); 
       $('#vehShortTestAttachment1').uploadifyCancel(queueID); 
       $('#vehShortTestAttachment1').uploadifyClearQueue();      
      } 
     }, 
     'onAllComplete':function(event, data) 
     {      
      $("#attachments-submit-case-button").attr("disabled", false); 

      if(!isFileBig) 
       submitFormDetails(); 
     } 
    }); 

Answer 1

Vous pouvez vérifier s'il y a upload-éléments présents lorsque l'utilisateur tente de subbmit la forme

$("form").submit(function(evt) { 
    if ($(".uploadifyQueueItem").children().length > 0) { 
     evt.preventDefault(); 
     alert("There are still files to upload..."); 
    } 
    //... 
}); 

Edit: Il suffit de vérifier Pourquoi ne pas désactiver le bouton Soumettre, quand un fichier est sélectionné et ena le sur onAllComplete.

$("#fileInput").uploadify({ 
    //... 
    onSelectOnce: function() { 
     $("#btn_submit").attr("disabled", true); 
    }, 
    onAllComplete: function() { 
     $("#btn_submit").attr("disabled", false); 
    } 
}); 

Answer 2

Juste un extrait, mais c'est à peu près ce que je utilise ...

onInit   : function () { 
     $('#uploadbtn').attr('disabled', true); 
    }, 
    onSelect   : function (a, b, c, d, e) { 
     $('#uploadbtn').attr('disabled', false); 
    }, 

Je ne sais pas pourquoi vous avez 6 boutons de navigation .. mais je ne pense pas questions dans ce cas.

Answer 3

L'événement onselect:

'onSelect': function (e, fileID, fileObj) { 
     $(".editor-form-submit").show(); 
} 

malheureusement que les feux APRÈS le swf est fait vérifier la taille du fichier, etc. C'est pourquoi il y a peu de temps entre la sélection du fichier et l'événement select réel, dans Wich l'utilisateur peut soumettre le formulaire.

Si quelqu'un sait de toute façon obtenir un événement "avant que le swf de téléchargement" ouvre la boîte de dialogue, cela serait grandement apprécié.