CODEWITHSUNDEEP
c#asp.nethtmlfileupload
priceline
priceline

Reputation: 111

Multi file upload using c# on ASP.NET 4.0 environment

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.

Upvotes: 11

Views: 33139

Answers (6)

meer
meer

Reputation: 982

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

http://www.dotnetfunda.com/articles/article1062-fileupload-uploading-file-to-the-server-without-clicking-a-button.aspx

Upvotes: -1

Devraj Gadhavi
Devraj Gadhavi

Reputation: 3611

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.

Upvotes: 6

Shreya
Shreya

Reputation: 204

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;
    }
}

Upvotes: 6

N&#233;stor Hern&#225;ndez Ojeda
N&#233;stor Hern&#225;ndez Ojeda

Reputation: 166

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.

Upvotes: -1

Tim Meers
Tim Meers

Reputation: 928

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.

Upvotes: 1

Devin Burke
Devin Burke

Reputation: 13820

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.

Upvotes: 5

Related Questions