FileUpload In UpdatePanel HasFile Returns False Asp.Net Ajax

This example shows how to use FileUpload Control In UpdatePanel Using Asp.Net Ajax when FileUpload.HasFile method returns false inside Update Panel.

If you are uploading files with FileUpload Inside Ajax UpdatePanel, Upload fails because few controls doesn't work with Ajax Partial postbacks.

To make full page postback for uploads to work we need to define PostBackTrigger for upload button outside ContentTemplate in html source.

HTML SOURCE

---

   1:  <asp:ScriptManager ID="ScriptManager1" runat="server"/>

   2:   

   3:  <asp:UpdatePanel ID="UpdatePanel1" runat="server">

   4:  <ContentTemplate>

   5:  <asp:FileUpload ID="FileUpload1" runat="server" />

   6:  <asp:Button ID="btnUpload" runat="server" 

   7:              Text="Upload File" 

   8:              onclick="btnUpload_Click"/>

   9:  <asp:Label ID="lblMessage" runat="server"></asp:Label>

  10:  </ContentTemplate>

  11:   

  12:  <Triggers>

  13:  <asp:PostBackTrigger ControlID="btnUpload" />

  14:  </Triggers>

  15:  </asp:UpdatePanel>

Now we can write code in Click Event of Button to Upload Files With FileUpload Control In UpdatePanel.

protected void btnUpload_Click(object sender, EventArgs e)
    {
        if (FileUpload1.HasFile)
        {
            string fileName = FileUpload1.PostedFile.FileName;
            FileUpload1.SaveAs(Server.MapPath("~/Uploads/" + fileName));
            lblMessage.Text = "File uploaded successfully";
        }
    }

Tweet

If you like this post than join us or share