Quickstart: Upload to the filesystem

This quickstart will walk you through building a page to handle uploads to the server filesystem, and configuring ASP.NET to accept large uploads.

Download Source Code

» Prerequisites

An ASP.NET site with a page you want to use to handle uploads. This example is downloadable as an ASP.NET 2.0 web site solution, but the code and settings described below will work exactly the same in any version of ASP.NET (v1.0-v3.5).

» Setting the form enctype

To set up an ASP.NET page for upload, set the server form's encoding type (enctype) to "multipart/form-data" instead of the default of "application/x-www-form-urlencoded". This switches the form's POST format to an RFC 1867 MIME encoded format instead of the default name value pair format.

To set the form's enctype

1. Open the page in source view
2. Find the form element
3. Add the enctype="multipart/form-data" attribute to the form element

After setting the enctype, the form element on the page should look like this:

<form runat="server" enctype="multipart/form-data">
...
</form>

» Adding the HTML file input control

To allow the user to pick a file, use an HTML file input control.

To add an html file input control

1. Switch the page to design view
2. From the HTML tab of the toolbox, drag an Input (File) control onto the page
3. Set the ID property of the control to "uploadFile"
4. Add the runat="server" attribute to the control

The page should now look like this:

» Adding a button with upload handling code

We'll need a button to submit an upload and attach server side code to handle it.

To add a button and wire it up

1. Switch the page to design view
2. From the Standard tab of the toolbox, drag a Button control onto the page
3. Set the ID property of the control to "uploadButton"
4. Set the Text property of the control to "Upload"
5. Double-click the button to create an event handler for its click event
6. Import the System.IO namespace
7. Inside the event handler, add the following code:

   protected void uploadButton_Click(object sender, EventArgs e)
{
    // Check to see if a file was actually selected
    if (uploadFile.PostedFile != null && uploadFile.PostedFile.ContentLength > 0)
    {
        // Get the filename and folder to write to
        string fileName = Path.GetFileName(uploadFile.PostedFile.FileName);
        string folder = Server.MapPath("~/Files/");
        
        // Ensure the folder exists
        Directory.CreateDirectory(folder);

        // Save the file to the folder
        uploadFile.PostedFile.SaveAs(Path.Combine(folder, fileName));

        Response.Write("Uploaded: " + fileName);
    }
}

The page should now look like this:

» Setting up the web.config to handle uploads

To handle files larger than the default request size (4 MB), add settings to the web.config to control the maximum request size and timeout. For this example, we'll use a 1 GB max request length and a 10 minute timeout.

To set up the web.config to handle uploads

1. Open the web.config file
2. Navigate to just before the ending system.web tag
3. Add the following element inside the system.web tag:

   <httpRuntime maxRequestLength="1048576" executionTimeout="600" />

Download Source Code

SlickUpload

Painless ASP.NET file uploads

• Handle large files
• Upload with progress bar
• Gracefully handle cancellation and errors
• Stream directly to file or database
• Drag-drop simple, yet highly customizable
• Solid, responsive support

» more info | live demo | download