Learn how to use FileUpload Control to upload files in ASP.NET and C# with this simple tutorial. For this tutorial you have to add a fileupload control to upload file, a label control to display the result and an image control to display the uploaded image from the server ( for demonstration I am uploading only image files, no validation is implemented). The code is created to demonstrate the upload of an image file and display the result.

Procedure:

1. Create a new website using VWD Express or Visual Studio.
2. Add a new web form called fileupload.aspx.
3. Add a label control, image control and file upload control and button control to fileupload.aspx and set the ID of the controls as shown below. Or just copy and paste the below code.

<form id="form1" runat="server">
 <div>
 <br />
 <asp:Label ID="lbl_Result" runat="server"></asp:Label>&nbsp;&nbsp;&nbsp;<asp:Image
 ID="Image1" runat="server" Visible="False" />
 <br />

 <asp:FileUpload ID="file_Image" runat="server" Width="300px" />

 <br />
 <asp:Button ID="Button1" runat="server" Text="Upload" />
 </div>
 </form>

4. Now double click the button control in design view of fileupload.aspx. This will add the OnClick=”Button1_Click” in the button control and Button1_click event in the code behind file.

5. To use the file upload control you have to add the System.Web.UI.WebControls NameSpace in the codebehind file of fileupload.aspx file.

using System.Web.UI.WebControls;

6. Now copy and paste the below code inside the Button1_Click Event

protected void Button1_Click(object sender, EventArgs e)
 {

 ////saving file in the physical folder;

 FileUpload FileUpload1 = file_Image;

 string virtualFolder = "~/images/";

 string physicalFolder = Server.MapPath(virtualFolder);

 FileUpload1.SaveAs(physicalFolder + FileUpload1.FileName);

 lbl_Result.Text = "Your file " + FileUpload1.FileName + " has been uploaded.";

 Image1.Visible = true;
 Image1.ImageUrl = virtualFolder + FileUpload1.FileName;

 }

7. The code works like this, First the fileupload control is assigned to FileUpload1 object.

8. The virtual location of the images folder is assigned to the string virtualFolder.

9. From the virtual folder the physical location of the folder is found using the server.mappath method.

10. Then the uploaded file is saved in the actual location of the images folder.

11. After saving the file(in our case it is an image file, if you upload exe file you will get error) the label_Result control text is updated with the name of the uploaded file.

12. The visible property of Image1 control is set to true.

13. Finally, the imageurl of the Image1 Control is set to the virtual location of the image file, so that we can display the uploaded image.

Complete Code Sample:

FileUpload.aspx :

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FileUpload.aspx.cs" Inherits="Management_FileUpload" %>

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head runat="server">
 <title></title>
 </head>
 <body>
 <form id="form1" runat="server">
 <div>
 <br />
 <asp:Label ID="lbl_Result" runat="server"></asp:Label>&nbsp;&nbsp;&nbsp;<asp:Image
 ID="Image1" runat="server" Visible="False" />
 <br />
 <br />
 <asp:FileUpload ID="file_Image" runat="server" Width="300px" />
 <br />
 <br />
 <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Upload" />
 <br />
 <br />
 <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="fileupload.aspx">Reload</asp:HyperLink>
 </div>
 </form>
 </body>
 </html>

FileUpload.aspx.cs

using System;
 using System.Web.UI.WebControls;

 public partial class Management_FileUpload : System.Web.UI.Page
 {

 protected void Button1_Click(object sender, EventArgs e)
 {

 ////saving file in the physical folder;

 FileUpload FileUpload1 = file_Image;

 string virtualFolder = "~/images/tutorialimages/";

 string physicalFolder = Server.MapPath(virtualFolder);

 FileUpload1.SaveAs(physicalFolder + FileUpload1.FileName);

 lbl_Result.Text = "Your file " + FileUpload1.FileName + " has been uploaded.";

 Image1.Visible = true;
 Image1.ImageUrl = virtualFolder + FileUpload1.FileName;

 }
 }