Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

jQuery Upload Multiple Files using Asp.net with Multiple File Upload Plugin Example

Dec 20, 2012
Introduction:

Here I will explain how to upload multiple files in asp.net using JQuery with multiple file upload plugin.


We can implement this concept by using multiple file upload plugin with few simple steps for that first create new web application >> Right click on your application >> Select Add New Folder and Give name as UploadFiles.

After completion of folder creation write the following code in your aspx page


<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>jQuery Upload multiple files in asp.net</title>
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="jquery.MultiFile.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="file_upload" class="multi" runat="server" />
<asp:Button ID="btnUpload" runat="server" Text="Upload"
onclick="btnUpload_Click" /><br />
<asp:Label ID="lblMessage" runat="server" />
</div>
</form>
</body>
</html>
If you observe above code in header section I added one script file that file you can get it from attached folder or you can get it from here multiple file upload plugin

Now in code behind add following namespaces


using System;
using System.IO;
using System.Web;
After that write the following code in code behind

C# Code


protected void btnUpload_Click(object sender, EventArgs e)
{
HttpFileCollection fileCollection = Request.Files;
for (int i = 0; i < fileCollection.Count; i++)
{
HttpPostedFile uploadfile = fileCollection[i];
string fileName = Path.GetFileName(uploadfile.FileName);
if (uploadfile.ContentLength > 0)
{
uploadfile.SaveAs(Server.MapPath("~/UploadFiles/") + fileName);
lblMessage.Text += fileName + "Saved Successfully<br>";
}
}
}
VB.NET Code


Imports System.Web

Public Class Handler2 : Implements IHttpHandler

Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
context.Response.ContentType = "text/plain"
Dim uploadFiles As HttpPostedFile = context.Request.Files("Filedata")
Dim pathToSave As String = HttpContext.Current.Server.MapPath("~/UploadFiles/") & uploadFiles.FileName
uploadFiles.SaveAs(pathToSave)
End Sub

Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
Get
Return False
End Get
End Property

End Class
Demo

Download sample code attached

If you enjoyed this post, please support the blog below. It's FREE!

Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email

27 comments :

Anonymous said...

hhh

Unknown said...

can u explain 'is it possible to upload the file(txt/icons/jpg) in forms like "filename.aspx" '

Unknown said...

hello, in the example you have shown with multi class I no longer intercept the event afterfileselect the plugin. thank you very much

Charlie said...

But can we show the selected file uploads in another div.

as of now its coming below the fileupload button, i want to show below the upload button

Unknown said...

I want to update the uploaded files so how can i display the uploaded files under file upload control as displayed while uploading the files so that i can remove the old files and upload the new files,,

Unknown said...

Thanks sir..............

Anonymous said...

Thanks dude...:)

Sushil Shrestha said...

..It works.. But i hav "FileName" nvarchar(256) column in my database.. How can i save only fileNames of all those files..

Vivek Bhangre said...

how can we validate this using validation control.

Unknown said...

this code did not work in visualstudio4.0 sir can u explain

Unknown said...

using with updatepanel not working.

Anonymous said...

It works perfectly on web forms but when placed inside a user control it just stops working.

Unknown said...

This is too good searching from long like this much simple.

But can you display thumb of selected images? please do this from my site this is work only IE older version.

Is there any way to do this?

Anonymous said...

sir how can upload multiple file like gmail in asp.net?

Jobsmaster said...

It works perfectly on web forms....

Anonymous said...

Vary nice......
Rajesh M Somvanshi

Unknown said...

So good sir..

Unknown said...

thank you so much

Anonymous said...

what about limit of file size?
thank

Anonymous said...

very helpful

P@v@N said...
This comment has been removed by the author.
lyricist said...

hi ..sir..
how to save multiple file names in database..?

crao said...

Excellent...thx.

Unknown said...

How to browse multiple files and show each file separately with X icons ?
ex.
X file1.txt
X file2.doc
X file3.jpg

st said...

hi sir this code is not working properly with update panel

Unknown said...

i want to use multiple file uploads in a grid with add new row functionality but it is taking all files in HttpFileCollection fileCollection = Request.Files; i want to save multiple file upload row wise and also it file with same name not saving in Upload Files Folder

Anonymous said...

i want to use multiple file uploads in a grid with add new row functionality but it is taking all files in HttpFileCollection fileCollection = Request.Files; i want to save multiple file upload row wise and also it file with same name not saving in Upload Files Folder

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.