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.
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
Hi.. It is working fine... but,uploaded files are going after postback when i am adding a linkbutton with uploaded file name to download those files
ReplyDelete