I am looking for a solution to upload multiple files (click on browse button, and select multiple files using shift key).
I see several solutions that need to be uploaded one by one by clicking browse button, and click submit button. But I need to allow users to select multiple files at the same time.
Set the property "AllowMultiple = true" as below. This property is available for 4.5 framework.
<asp:FileUpload ID="file_upload" runat="server" AllowMultiple="true" />
This will allow you to select multiple files at one time
Aspx Code:
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="file_upload" runat="server" AllowMultiple="true" />
<asp:Button ID="btnFileUpload" runat="server" Text="Upload" OnClick="btnFileUpload_Click" />
<asp:Label ID="lblUploadStatus" runat="server"></asp:Label>
</div>
</form>
Aspx.cs Code:
protected void btnFileUpload_Click(object sender, EventArgs e)
{
try
{
if (file_upload.HasFile && file_upload.PostedFiles.All(x => x.ContentType == "image/jpeg" && x.ContentLength < 102400))
{
foreach (var file in file_upload.PostedFiles)
{
file_upload.SaveAs(Server.MapPath("~/") + Path.GetFileName(file.FileName));
}
lblUploadStatus.Text = "File(s) uploaded successfully.";
}
else
{
lblUploadStatus.Text = "Please upload proper file.";
}
}
catch (Exception ex)
{
lblUploadStatus.Text = "Error in uploading file." + ex.Message;
}
}
We have been using the below jQuery plugin to help us.
jQuery Multiple File Upload Plugin
After including the necessary js file : jQuery.multifile.pack.js, we can use it like below.
<input type="file" id="flAttachment" runat="server" tabindex="8" class="multi max-3 accept-gif|jpg|xlsx|xls|doc|docx|pdf|png" size="37" />
Giving class="multi" makes it to accept more than one file.
You can also apply the constraints if you want. Like class = "max-3" would allow maximum three files to be uploaded. class = "accept-gif|jpg" would only allow files with gif OR jpg extensions to be uploaded.
For getting the multiple files on the sever side you will need to include the namespace : System.Web;
Then you can have the below code for iterating through each file uploaded.
if (Request.Files.Count > 0)
{
HttpFileCollection attachments = Request.Files;
for (int i = 0; i < attachments.Count; i++)
{
HttpPostedFile attachment = attachments[i];
if (attachment.ContentLength > 0 && !String.IsNullOrEmpty(attachment.FileName))
{
//do your file saving or any related tasks here.
}
}
}
This would be regardless of .net framework version.
The <input type="file"> is heavily locked down by the web browser due to security concerns. It does not allow multiple file selections. You will need to use Flash or Silverlight to do this, or use multiple <input type="file"> fields.
You can allow the user to select one file and then provide an "Add Another File" button, which generates another file upload input using jQuery. You would be able to allow an indefinite number of uploads that way, but the user will have to browse for each of them individually.
On a side note, HTML 5 will support multiple file uploading, but it is not widely implemented in current web browsers and so is not an option.
As Justin said you would have to use Flash or Silverlight. I took the latter of the two and am very pleased.
Take a look at the Silverlight Multi File Uploader on Codeplex. This is what I've used and it's been great. It's also very easy to customize to fit your needs. It's uploaded around 10,000 images for me so far and never missed a beat.
You could use JQeryFileUpload's drag and drop feature, we use it for our CMS and our users seem happy with the solution, you can try the demo site here. Just drop as many files as you want and see it in action, It's highly customisable.
You just need to add an attribute of multiple like this
<input type="file" name="postedFiles" id="InvoiceAttachmentsFiles" multiple="multiple" />
check this site
http://www.aspdotnet-suresh.com/2012/12/aspnet-upload-multiple-files-using.html
and you could also use this
