Comment ajouter le validateur requis à ajax AsyncFileUpload?

Question

Comment ajouter le validateur requis côté client à asyncfileupload, pour forcer l'utilisateur à sélectionner le fichier avant de soumettre la page.

Answer 1

J'utilise un RequiredFieldValidator qui valide un TextBox invisible. Le TextBox est rempli avec un texte arbitraire dans la fonction OnClientUploadComplete. La seule chose que vous ne pouvez pas faire est de régler le focus quand il est validé. L'exemple utilise jQuery.

<ajaxToolkit:AsyncFileUpload runat="server" ID="afu" ClientIDMode="AutoID" UploaderStyle="Traditional" OnClientUploadComplete="asyncUploadComplete" OnClientUploadStarted="asyncUploadStarted" /> 
<asp:RequiredFieldValidator runat="server" ID="rfv" ControlToValidate="txt" Text="The file is required!" SetFocusOnError="false" /> 
<asp:TextBox runat="server" ID="txt" style="display:none" MaxLength="0" /> 
<script type="text/javascript"> 
    // AsyncFileUpload - OnClientUploadComplete 
    function asyncUploadComplete(sender, args) { 
     // Assemble info of uploaded file 
     var contentType = args.get_contentType(); 
     var info = args.get_length() + " bytes"; 
     if (contentType.length > 0) { 
      info += " - " + contentType; 
     } 
     info += " - " + args.get_fileName(); 
     // Put info in the first input field after the AsyncFileUpload control 
     var source = $(sender.get_element()); 
     source.nextAll('input').val(info); 
     // Validate immediately 
     ValidatorEnable(source.nextAll('span')[0], true); 
    } 
    // AsyncFileUpload - OnClientUploadStarted 
    function asyncUploadStarted(sender, args) { 
     // Clear the first input field after the AsyncFileUpload control 
     var source = $(sender.get_element()); 
     source.nextAll('input').val(''); 
    } 
</script> 

Answer 2

Vous pouvez également définir le texte d'une zone de texte caché dans la méthode côté serveur en utilisant C# ou VB, plutôt que d'un côté client fonction Javascript ou JQuery.

protected void afu_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e) 
    { 
     afu.SaveAs(Server.MapPath("Uploads\\") + e.FileName); 

     txt.Text = e.FileName;  
    }