CODEWITHSUNDEEP
c#asp.netfile-upload
user981235
user981235

Reputation: 171

ASP.NET FileUpload in UpdatePanel - still not working

Attempting to use a FileUpload or AsyncFileUpload control in an updatepanel on a NET 4.5/C# web application.

I've tried using either standard Scriptmanager or ToolKitScriptManager in my masterpage.

My Save button is set as a PostBackTrigger (tried AsyncPostbackTrigger too).

No matter what, my (Async)FileUpload.HasFile always returns false.

Remove the updatepanel and both uploadcontrols work fine.

What really throws me is that I have this working in another project (scriptmanager in masterpage, Fileupload in updatepanel, SaveButton is PostbackTrigger).

Is there some specific AJAX version or .NET version that can cause problems?

This is extremely frustrating.

Upvotes: 16

Views: 60115

Answers (4)

Tran Anh Hien
Tran Anh Hien

Reputation: 747

In Page_Load add: Page.Form.Attributes.Add("enctype", "multipart/form-data");

Upvotes: 10

callisto
callisto

Reputation: 5083

Adding the button to the UpdatePanel's trigger tag, I got it working:

<asp:UpdatePanel ID="UpdatePanel" runat="server">
    <ContentTemplate>
        <asp:FileUpload ID="FileUpload" runat="server" />
        <asp:Button ID="btnUpload" runat="server" Text="Upload"
           OnClick = "btnUpLoad_OnClick" />               
    </ContentTemplate>
    <Triggers>
        <asp:PostBackTrigger ControlID = "btnUpload" />
    </Triggers>
</asp:UpdatePanel>

I did not have to do anything different server-side (like user5159158's answer).

Upvotes: 15

user5159158
user5159158

Reputation:

File Upload will not work with a partial post back. It requires full page request. So add the below line in your page load.

ScriptManager.GetCurrent(this).RegisterPostBackControl(this.YourControlID);

Upvotes: 8

Win
Win

Reputation: 62260

FileUpload

FileUpload requires full page request. This is a limitation of the XmlHttpRequest component used in all AJAX frameworks for asynchronous calls to the application.

What really throws me is that I have this working in another project (scriptmanager in masterpage, Fileupload in updatepanel, SaveButton is PostbackTrigger).

I think you are using Full PostBack, although FileUpload is inside **UpdatePanel.

For example,

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
   <ContentTemplate>
      <asp:FileUpload ID="FileUpload1" runat="server" />
      <asp:Button ID="SaveButton" runat="server" OnClick="SaveButton_Click" 
          Text="Upload your file" />
   </ContentTemplate>
   <Triggers>
      <asp:PostBackTrigger ControlID="SaveButton" />
   </Triggers>
</asp:UpdatePanel>

AsyncFileUpload

If you use AsyncFileUpload with UpdatePanel, AsyncFileUpload.HasFile should only checked inside UploadedComplete (you cannot check inside Button click event).

The reason is AsyncFileUpload is uploaded the file via Async by itself.

Note: make sure you use ToolkitScriptManager instead of ScriptManager

<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="Server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <ajaxToolkit:AsyncFileUpload runat="server" ID="AsyncFileUpload1"
            OnUploadedComplete="AsyncFileUpload1_UploadedComplete" />
        <asp:TextBox runat="server" ID="TextBox1" /><br/>
        <asp:Button ID="SaveButton" runat="server" OnClick="SaveButton_Click"
            Text="Save" />
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="SaveButton" />
    </Triggers>
</asp:UpdatePanel>

private string FileName
{
    get { return (string)(Session["FileName"] ?? ""); }
    set { Session["FileName"] = value; }
}

protected void SaveButton_Click(object sender, EventArgs e)
{
    string fileName = FileName;
    string path = Server.MapPath("~/App_Data/");
    var fileInfo = new FileInfo(path + FileName);
}

protected void AsyncFileUpload1_UploadedComplete(object sender, 
    AsyncFileUploadEventArgs e)
{
    if (AsyncFileUpload1.HasFile)
    {
        FileName = AsyncFileUpload1.FileName;
        string path = Server.MapPath("~/App_Data/");
        AsyncFileUpload1.SaveAs(path + AsyncFileUpload1.FileName);
    }
}

Other Thoughts

I personally do not like using AsyncFileUpload inside UpdatePanel. Instead, I'll rather use Full PostBack if I need to upload a file.

Upvotes: 8

Related Questions