Conventional File Upload In ASP.NET

This post is going to give some basic idea and common scenarios about the file uploading in ASP.NET. Mostly every data driven Website will provide this feature. Also, every ASP.NET developer faces this kind of requirement at least once in his/her developer life.

Note: The file upload control renders slightly/completely differently from one Browser to another Browser. If you want to give a consistent UI, you can check my previous post here. Also, you can read this article from my blog.

If you want to upload a file in ASP.NET, it is very simple. You need to include “File Upload” control on your form and place a command button, which triggers the upload process and saves the respective file in the specified location on the Server.

<div>
    <asp:FileUpload runat="server" ID="fileUploader" AllowMultiple="false" /> <br />
    <asp:Button runat="server" Text="Upload" ID="btnUpload" OnClick="btnUpload_Click" />
</div>

On the code at the backend, you should include the following:

protected void btnUpload_Click(object sender, EventArgs e)
{
        if (fileUploader.HasFile)
        {
            fileUploader.SaveAs(Server.MapPath(@ "~\UploadedFile\")+ fileUploader.FileName);
        }

}

Note: In the code snippet, given above, when you click the button, it will save the file in a specified location on the Server. As per the code, given above, it looks for the directory “UploadedFile” in the Server. Thus, you need to create the directory on your Application, before executing the code, otherwise the Application will throw an error, while running.

Upload specific File Types

In some cases, we may want to force the user to upload only the specific file types. This is an inevitable scenario for the professional programmers. In this case, we should validate the file types. If it passes, we can go with the upload. Otherwise, the user will be notified by an “error” message. In order to validate, I’m going to use the built-in ASP.NET validation control i.e. "Regular Expression Validator".

<div>
    <asp:FileUpload runat="server" ID="fileUploadExcel" AllowMultiple="false" /> <br />
    <asp:Button runat="server" Text="Upload" ID="btnUploadExcel" OnClick="btnUploadExcel_Click" />
    <asp:RegularExpressionValidator runat="server" ControlToValidate="fileUploadExcel" ValidationExpression="^.*\.xls[xm]?$" ErrorMessage="Please upload excel file only"></asp:RegularExpressionValidator>
</div>

The code at the backend has not changed much, compared to the previous one.

protected void btnUploadExcel_Click(object sender, EventArgs e)
{
        if (fileUploadExcel.HasFile)
        {
           fileUploadExcel.SaveAs(Server.MapPath(@ "~\UploadedFile\") + fileUploadExcel.FileName);
        }
}

Restrict Uploaded File Size

In some tedious cases, we need to restrict the file size. Say for example, we may need to force the user to upload MS Excel file, which is not more than 1 MB. In this case, we should validate this one from the Server, as shown below:

protected void btnUploadExcel_Click(object sender, EventArgs e)
{
if (fileUploadExcel.HasFile)
  {
      int fileSize = fileUploadExcel.PostedFile.ContentLength;
      if (fileSize <= 1048576)
            fileUploadExcel.SaveAs(Server.MapPath(@"~\UploadedFile\") + fileUploadExcel.FileName);
       else
      {
            lblError.Text = "File size exceeds more than 1 MB.";
       }
   }
}

Upload Multiple Files

In some cases, we may need to upload the multiple files. ASP.NET gives an easy way to achieve this. The file upload Server control had a property called “AllowMultiple”, which is a boolean value (either true or false). By turn, if it is true, the file upload control allows you to select the multiple files.

<div>
    <asp:FileUpload runat="server" ID="fileUploadMultiple" AllowMultiple="true" /> <br />
    <asp:Button runat="server" Text="Upload" ID="btnUploadMultiple" OnClick="btnUploadMultiple_Click" />
    <asp:RegularExpressionValidator runat="server" ControlToValidate="fileUploadMultiple" ValidationExpression="^.*\.doc[x]?$" ID="RegularExpressionValidator1" ErrorMessage="Please upload word file only"></asp:RegularExpressionValidator>
    <asp:Label runat="server" ID="Label1" Style="color: red;"></asp:Label>
</div>

In the code available at the backend, the code looks as given below. It gets the files, loops through the selected files and checks the file size. It stores it in the particular path.

protected void btnUploadMultiple_Click(object sender, EventArgs e)
{
        if (fileUploadMultiple.HasFile)
        {
            HttpFileCollection files = Request.Files;
            for (int i = 0; i < files.Count; i++)
            {
                HttpPostedFile file = files[i];
                if (file.ContentLength > 0) fileUploadMultiple.SaveAs(Server.MapPath(@ "~\UploadedFile\") + file.FileName);
            }
        }
 }

I hope this post gives some basic understanding and standard validations during the file upload in ASP.NET. Let me know your thoughts as comments.