Last update: 7th May 2024
Microsoft has introduced the FileUpload server side control in Asp.Net version 2.0. This has simplified the way files are uploaded using Asp.Net. You don't need a plug-in do multiple files uploads. I'll show you how easily you can upload multiple files in Asp.Net using C# and VB.✔️ Elements used in this example.
For file upload, we will use Asp.Net "FileUpload" control with HttpFileCollection class.
✔️ Extra features in this example.
In addition, we will also see how we can restrict or limit the number files to be uploaded. The limit we will set in our example is 10.
Limiting or restricting the number of files for upload using Asp.Net has its advantages.
01) It will not put unnecessary burden on the Host server, and save valuable bandwidth.
02) We can efficiently upload multiple files at a time, and in the process check the permissible size, type of files etc, at the server side using code behind procedures.
We will also check for duplicate files before uploading the files to the server, "ignoring" the files extension. That is, we will not upload more than one file with the same name, irrespective of the file type.
For example: If the first file is 1.jpeg and it is uploaded, then 1.pdf will be considered duplicate and will not be uploaded.
✔️ Asp.Net FileUpload control
The Asp.Net FileUpload control is a combination of a "Textbox" and a "Button" control. Together it will allow us to select file(s) to upload at a remote location. Clicking the button will pop up a "Dialog box or a Window", which will show a list of Folders and Files in the drive of your local machine. The Textbox will show the full path with the selected file(s) name.
By default, the "FileUpload" control will allow the users to select a "single" file at a time. This is how it looks when you first add it to the web page.
<asp:FileUpload ID="fileUpload" runat="server" />
To allow users to select Multiple files just add multiple="true".
<asp:FileUpload ID="fileUpload" multiple="true" runat="server" />
Finally, we will upload the files using Asp.Net HttpFileCollection class. This class will keep an eye on all the files uploaded from client side. There by giving vital information about the file size, type etc. Along with it we will use System.IO namespace, which will allow us to check for duplicate files in a particular Folder or Directory on the server.
You can also use jQuery Multifile Plug-in to upload multiple files in Asp.Net. This plug-in has Select and Un-select options.
Let's get on with the example.
<!DOCTYPE html> <html> <head> <title>Multiple File Upload</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> </head> <body> <form id="form1" runat="server"> <div id="divFile"> <h3>Multiple File Upload in Asp.Net (C#)</h3> <p> <asp:FileUpload ID="fileUpload" multiple="true" runat="server" /> </p> <p> <asp:Button ID="btUpload" Text ="Upload Files" OnClick="Upload_Files" runat="server" /> </p> <%--SHOW UPLOAD MESSAGE--%> <p><asp:label id="lblFileList" runat="server"></asp:label></p> <p><asp:Label ID="lblUploadStatus" runat="server"></asp:Label></p> <p><asp:Label ID="lblFailedStatus" runat="server"></asp:Label></p> </div> </form> </body>
We'll also do a simple validation at the client side. Check if the user has selected any file before calling the server side function.
<script> $('#btUpload').click(function() { if (fileUpload.value.length == 0) { // CHECK IF FILE(S) SELECTED. alert('No files selected.'); return false; } }); </script> </html>
👉 Now, if you want to check the file size before uploading, you must check this example.
using System; using System.IO; using System.Web; public partial class _Default : System.Web.UI.Page { protected void Upload_Files(object sender, EventArgs e) { if (fileUpload.HasFile) // CHECK IF ANY FILE HAS BEEN SELECTED. { int iUploadedCnt = 0; int iFailedCnt = 0; HttpFileCollection hfc = Request.Files; lblFileList.Text = "Select <b>" + hfc.Count + "</b> file(s)"; if (hfc.Count <= 10) // 10 FILES RESTRICTION. { for (int i = 0; i <= hfc.Count - 1; i++) { HttpPostedFile hpf = hfc[i]; if (hpf.ContentLength > 0) { if (!File.Exists(Server.MapPath("CopyFiles\\") + Path.GetFileName(hpf.FileName))) { DirectoryInfo objDir = new DirectoryInfo(Server.MapPath("CopyFiles\\")); string sFileName = Path.GetFileName(hpf.FileName); string sFileExt = Path.GetExtension(hpf.FileName); // CHECK FOR DUPLICATE FILES. FileInfo[] objFI = objDir.GetFiles(sFileName.Replace(sFileExt, "") + ".*"); if (objFI.Length > 0) { // CHECK IF FILE WITH THE SAME NAME EXISTS (IGNORING THE EXTENTIONS). foreach (FileInfo file in objFI) { string sFileName1 = objFI[0].Name; string sFileExt1 = Path.GetExtension<(objFI[0].Name); if (sFileName1.Replace(sFileExt1, "") == sFileName.Replace(sFileExt, "")) { iFailedCnt += 1; // now allowing duplicate. break; } } } else { // save the file in a folder. hpf.SaveAs(Server.MapPath("CopyFiles\\") + Path.GetFileName(hpf.FileName)); iUploadedCnt += 1; } } } } lblUploadStatus.Text = "<b>" + iUploadedCnt + "</b> file(s) Uploaded."; lblFailedStatus.Text = "<b>" + iFailedCnt + "</b> duplicate file(s) could not be uploaded."; } else lblUploadStatus.Text = "Max. 10 files allowed."; } else lblUploadStatus.Text = "No files selected."; } }
Option Explicit On Imports System.IO Partial Class _Default Inherits System.Web.UI.Page Protected Sub Upload_Files(sender As Object, e As EventArgs) ' CHECK IF ANY FILE HAS BEEN SELECTED. If fileUpload.HasFile Then Dim iUploadedCnt As Integer = 0 Dim iFailedCnt As Integer = 0 Dim hfc As HttpFileCollection = Request.Files lblFileList.Text = "Select <b>" & hfc.Count & "</b> file(s)" If hfc.Count <= 10 Then ' 10 FILES RESTRICTION. For i As Integer = 0 To hfc.Count - 1 Dim hpf As HttpPostedFile = hfc(i) If hpf.ContentLength > 0 Then If Not File.Exists(Server.MapPath("CopyFiles\") & _ Path.GetFileName(hpf.FileName)) Then Dim objDir As New DirectoryInfo(Server.MapPath("CopyFiles\")) Dim objFI As FileInfo() = _ objDir.GetFiles(Replace(Path.GetFileName(hpf.FileName), _ Path.GetExtension(hpf.FileName), "") & ".*") If objFI.Length > 0 Then ' CHECK IF FILE WITH SAME NAME EXISTS (IGNORING THE EXTENTIONS). For Each file As FileInfo In objFI If Replace(objFI(0).Name, Path.GetExtension(objFI(0).Name), "") = _ Replace(Path.GetFileName(hpf.FileName), Path.GetExtension(hpf.FileName), "") Then iFailedCnt = iFailedCnt + 1 Exit For End If Next Else ' SAVE THE FILE IN A FOLDER. hpf.SaveAs(Server.MapPath("CopyFiles\") & _ Path.GetFileName(hpf.FileName)) iUploadedCnt = iUploadedCnt + 1 End If End If End If Next i lblUploadStatus.Text = "<b>" & iUploadedCnt & "</b> file(s) Uploaded." lblFailedStatus.Text = "<b>" & iFailedCnt & _ "</b> duplicate file(s) could not be uploaded." Else lblUploadStatus.Text = "Max. 10 files allowed." End If Else lblUploadStatus.Text = "No files selected." End If End Sub End Class
For single file upload just add the below code in the "Button" click event.
fileUpload.SaveAs(Server.MapPath("CopyFiles\" & fileUpload.FileName))
Note: "CopyFiles\" is the name of the folder at the server, in which the files will uploaded.
Browser Support:
Chrome 39.0 - Yes | FireFox 34.0 - Yes | Internet Explorer 11 - Yes | Safari - Yes