Introduction:
Here
I will explain how to upload multiple files in asp.net using JQuery with multiple file upload
plugin.
Description:
In previous article I explained Asp.net upload multiple files using jQuery with uploadify plugin, Create Online Poll System in Asp.net, jQuery open all external links in new window, jQuery lightbox image slideshow, jQuery disable right click on images, jQuery Rating example with database, jQuery password strength examples and many articles relating to JQuery, asp.net, SQL Server etc. Now I will explain how to upload multiple files in asp.net using JQuery with multiple file upload plugin.
In previous article I explained Asp.net upload multiple files using jQuery with uploadify plugin, Create Online Poll System in Asp.net, jQuery open all external links in new window, jQuery lightbox image slideshow, jQuery disable right click on images, jQuery Rating example with database, jQuery password strength examples and many articles relating to JQuery, asp.net, SQL Server etc. Now 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 Email
|
|||
27 comments :
hhh
can u explain 'is it possible to upload the file(txt/icons/jpg) in forms like "filename.aspx" '
hello, in the example you have shown with multi class I no longer intercept the event afterfileselect the plugin. thank you very much
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
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,,
Thanks sir..............
Thanks dude...:)
..It works.. But i hav "FileName" nvarchar(256) column in my database.. How can i save only fileNames of all those files..
how can we validate this using validation control.
this code did not work in visualstudio4.0 sir can u explain
using with updatepanel not working.
It works perfectly on web forms but when placed inside a user control it just stops working.
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?
sir how can upload multiple file like gmail in asp.net?
It works perfectly on web forms....
Vary nice......
Rajesh M Somvanshi
So good sir..
thank you so much
what about limit of file size?
thank
very helpful
hi ..sir..
how to save multiple file names in database..?
Excellent...thx.
How to browse multiple files and show each file separately with X icons ?
ex.
X file1.txt
X file2.doc
X file3.jpg
hi sir this code is not working properly with update panel
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
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
Note: Only a member of this blog may post a comment.