AsyncFileUpload postback provoque le double téléchargement

Question

J'ai implémenté le contrôle AsyncFileUpload sur une page Web. Cette page Web exige que les fichiers téléchargés apparaissent dans un GridView.
Le GridView contient les colonnes suivantes: « Nom du fichier », « Confidential » case à cocher, et un « Retirez » pour supprimer le fichier téléchargé.

Depuis le AsyncFileUpload postback ne fait pas une pleine page postback, je dois « forcer » une publication sur l'événement OnClientUploadComplete du contrôle AsyncFileUpload afin de rendre le gridview après avoir téléchargé un fichier. J'ai utilisé le javascript pour appeler __doPostBack. Dans cette publication, je lie uniquement mon GridView et affiche les informations sur le fichier (je ne sauvegarde pas le fichier).

Le problème: Lors de la première publication "partielle" de AsyncFileUpload, le fichier a été téléchargé avec succès, comme prévu. Sur le deuxième postback que je force avec __doPostBack, le fichier est re-téléchargé.
Vous pouvez vérifier cela en utilisant Google Chrome, qui affiche la progression du téléchargement. Le comportement est le suivant:
- Après avoir sélectionné le fichier, la progression passe de 0% à 100% et le fichier est téléchargé.
- Après cela, le __doPostBack s'exécute, et vous pouvez voir l'incrément de progression de téléchargement de nouveau de 0% à 100%.

Comment puis-je m'assurer que le Gridview est correctement rempli, mais que le fichier n'est pas téléchargé deux fois?

J'attaché une solution d'échantillon qui contient la question: https://www.yousendit.com/download/MzZFc2ZBNDRrYUN4dnc9PQ

Answer 1

Peut-être laid, mais fonctionne:

---

1) Ajouter un asp caché css-: Bouton ci-dessous l'aspic: AsyncFileUpload AsyncFileUpload1 contrôle .

<asp:Button runat="server" ID="btnClick" Text="Update grid" style="display:none"/> 

2) Sur la méthode Page_Load, retirez le if (Request.Params.Get("__EVENTTARGET") == "UploadPostback") et mettre son bloc dans un simple else au if précédent.

3) Sur la fonction AsyncFileUpload1_UploadedComplete, supprimez également la ligne if (Request.Params.Get("__EVENTTARGET") != "UploadPostback"), mais laissez intact tout ce qui se trouvait à l'intérieur.

4) Retour à l'aspx. Mettez un asp: UpdatePanel en dehors de la grille GridView1.

<asp:UpdatePanel runat="server" UpdateMode="Conditional"> 
    <Triggers> 
     <asp:AsyncPostBackTrigger ControlID="btnClick" EventName="Click" /> 
    </Triggers> 
    <ContentTemplate> 

    <asp:GridView ID="GridView1" ... 
    YOUR GRID CODE REMAINS THE SAME 
    </asp:GridView> 

    </ContentTemplate> 
</asp:UpdatePanel> 

5) La dernière étape consiste à modifier la fonction javascript côté client AjaxUploadComplete pour le faire déclencher la publication. Remplacez-le par les éléments suivants:

function AjaxUploadComplete() { 
    var btnClick = document.getElementById("btnClick"); 
    btnClick.click(); 
} 

---

Tout fichier que l'utilisateur sélectionne est téléchargé une seule fois.
Tous les changements ici sont destinés à être faits dans AjaxUpload.aspx & AjaxUpload.aspx.cs de votre AjaxUpload.zip.

Answer 2

Je n'ai pas accès à votre solution d'exemple qui contient le problème, mais je rencontre une double publication dans mon projet avec le composant AsyncFileUpload. J'ai trouvé une solution très simple:

Il suffit d'ajouter:

private bool justUploaded = false; 

Puis:

void AsyncFileUpload1_UploadedComplete(object sender, AsyncFileUploadEventArgs e) 
{ 
    if (justUploaded) return; 
    justUploaded = true; 
    // rest of your upload code 
} 

Answer 3

Il existe une solution plus simple

@@ t0x1n3Himself la solution u est donné très simple mais ne fonctionne pas

entourent le AsyncFileUpload avec un nom de panneau de mise à jour, il UpdatePanelAFU puis dans le UpdatePanelAFU faire comme suit:

protected void AsyncFileUpload_UpdatePanelAFU(object sender,AjaxControlToolkit.AsyncFileUploadEventArgs e) 
{ 

    if (Request.Params.Get("__EVENTTARGET") != "UpdatePanelAFU") 
     return; 
..... rest of the code 
} 

profiter!

Answer 4

Je trouve cela une solution plus élégante, qui se trouve ici: http://forums.asp.net/t/1951566.aspx?AsyncFileUpload+uploads+twice) mais au-dessous est mon modifié le code de travail entièrement:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>AsyncFileUpload Example</title> 
    <script type = "text/javascript"> 
     function uploadComplete(sender) { 
      $get("<%=lblMesg.ClientID%>").innerHTML = "File Uploaded Successfully"; 
      clearContents(); 
     } 


     function uploadError(sender) { 
      $get("<%=lblMesg.ClientID%>").innerHTML = "File upload failed."; 
      clearContents(); 
     } 


    function clearContents() { 
      var span = $get("<%=AsyncFileUpload1.ClientID%>"); 
      var txts = span.getElementsByTagName("input"); 
      for (var i = 0; i < txts.length; i++) { 
       if (txts[i].type == "text") { 
        txts[i].value = ""; 
       } 
       if (txts[i].type == "file") { 
        txts[i].value = ""; 
       } 
      } 
     } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <asp:ScriptManager ID="ScriptManager1" runat="server"> 
     </asp:ScriptManager> 
     <cc1:AsyncFileUpload OnClientUploadError="uploadError" 
      OnClientUploadComplete="uploadComplete" runat="server" 
      ID="AsyncFileUpload1" Width="400px" UploaderStyle="Modern" EnableViewState = "false" 
      UploadingBackColor="#CCFFFF" ThrobberID="imgLoader" OnUploadedComplete = "FileUploadComplete" 
      /> 
     <asp:Image ID="imgLoader" runat="server" ImageUrl = "~/images/loader.gif" /> 
     <br /> 
     <asp:Label ID="lblMesg" runat="server" Text=""></asp:Label> 






    </form> 
</body> 
</html> 

Answer 5

AsyncFileUpload a une propriété qui a nommé IsUploading. lorsque cette propriété est définie sur false, un postback va se produire. vous pouvez vérifier cette propriété comme ceci:

if(AsyncFileUpload1.IsUploading) 
{ 
    ..... upload codes 
} 

Answer 6

Je crois @Veera avait raison. UploadComplete a été appelé plusieurs fois lors du téléchargement du fichier. Ce qui suit a fonctionné pour moi.

void AsyncFileUpload1_UploadedComplete(object sender, AsyncFileUploadEventArgs e) { 
 
    if (AsyncFileUpload1.IsUploading) return; 
 
    // rest of your upload code 
 
}