Upload a file to server automatically inside a update panel in asp.net website

Question

I have a file upload inside the update panel, and an upload button that uploads the file to the server. Is it possible to upload the file without clicking the upload button? I want to remove the upload button and upload the file as soon as the file is selected from the user's machine. Or, have a 4 second timer, then call the upload_click to check if the fileupload has a file or not. How can I do it without a button inside update panel?

<asp:UpdatePanel ID="UP_DDL" runat="server" UpdateMode="Always" ChildrenAsTriggers="true">
    <ContentTemplate> 
        <asp:FileUpload ID="FileUpload1" runat="server" />
        <asp:Button ID="Upload" OnClick="Upload_Click" runat="server" Text="Upload" />
    </ContentTemplate>
    <Triggers>
        <asp:PostBackTrigger ControlID="Upload"/>
    </Triggers>
</asp:UpdatePanel>

protected void Upload_Click(object sender, EventArgs e)
{
    if (FileUpload1.HasFile)
    {
        //create the path to save the file to     
        string fileName = Path.Combine(Server.MapPath("~/Bulk Upload"), FileUpload1.FileName);
        //save the file to our local path  
        FileUpload1.SaveAs(fileName);
    }
}

Icarus · Accepted Answer · 2011-11-29 12:53:55Z

1

I am sure you can use any of the events on the HTML INPUT File element to fire up a full post back, which is all you need in order to upload the file automatically.

Google, at least on the standard interface, uses some sort of Flash plugin to accomplish what you want.

There might be some other jQuery plugins that provide this functionality out of the box. This one, for example, seems to do it.

edited Nov 29, 2011 at 12:53

answered Nov 29, 2011 at 12:48

Icarus

64.1k14 gold badges102 silver badges116 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Grant Thomas · Accepted Answer · 2011-11-29 12:42:10Z

0

You would need to mimic the click with some client-side code, such as using submit from Javascript - and this is not supported by at least one notable browser, I believe, IE.

Otherwise, you could use jQuery ajax calls to static web methods which do uploads on the fly, behind the scenes, when the value of the file upload control have changed.

answered Nov 29, 2011 at 12:42

Grant Thomas

45.1k10 gold badges88 silver badges129 bronze badges

Comments

IUnknown · Accepted Answer · 2011-11-29 12:54:59Z

0

You can hide Upload button with display:none inline style and add following code to Page_PreRender method:

FileUpload1.Attributes["onchange"] = ClientScript.GetPostBackClientHyperlink(Upload, "");

Or consider to use AsyncFileUpload control from AjaxControlToolkit

answered Nov 29, 2011 at 12:54

IUnknown

22.5k4 gold badges41 silver badges71 bronze badges

3 Comments

Mark Over a year ago

How can I just update the update panel so that the whole page doesnt refresh

IUnknown Over a year ago

You can't do this with standard FileUpload control since it requires full postback.

Ozair Kafray Over a year ago

I have tried to call __doPostBack('<%= btnUpload.ID %>', ""); in my javascript in onchange event of FileUpload Control. I do get the postback event but the PostedFile property is null, and HasFile = false. It works fine the second time I select a file!!

Collectives™ on Stack Overflow

Upload a file to server automatically inside a update panel in asp.net website

3 Answers 3

Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related