Before reading this article please go through my prvious article for better understanding.
Introduction
In my previous i had made use of to upload file, in asp.net we have new server side control called as "FileUpload control".
<input type="file" id="fileUpload" runat="server" name="fileUpload">
The FileUpload control does not automatically save a file to the server after the user selects the file to upload. You must explicitly provide a control or mechanism to allow the user to submit the specified file.
Uploading single file functionality at a time to the server this functionality we have already achieved in the earlier article.
Here I am going to display small code snippet by using which you can upload multiple files at a time.
The idea is you can select files from your folders and keep on adding to listbox and in one shot you can upload all the files I have provided functionalities like "Add", "Remove" & "Upload", technically speaking I am adding to the static arraylist and considering each array element as System.Web.UI.WebControls.FileUpload , while uploading just iterate through each webcontrol and SaveAs file to the specified location.
Note. To upload any of the file in respective folder user need to have permission for writing to the folder so please follow the following steps to prevent from the error.
How to set permission to virtual directory
Right Click on virtual directory which you have created for this project. Under directory Tab you will find.
- Read.
- Log Visits.
Index this resources are marked as checked (enables) in addition to this make ,write access enabled or checked. Click on Apply and Click on OK.
File. Uploader.ascx
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Uploader.ascx.cs" Inherits="Uploader" %>
<table>
<tr>
<td style="width: 163px">
<span style="font-size: 10pt; font-family: Verdana"><strong>Select file to upload:</strong></span>
</td>
<td style="width: 324px">
<asp:FileUpload ID="fUpload" runat="server" /> <asp:Button ID="btnAdd" runat="server" Text="Add" OnClick="btnAdd_Click" />
</td>
</tr>
<tr>
<td style="width: 163px">
</td>
<td style="width: 324px">
<asp:ListBox ID="lstFiles" runat="server" Width="324px"></asp:ListBox>
</td>
</tr>
<tr>
<td style="width: 163px">
</td>
<td style="width: 324px">
<asp:Button ID="btnRemove" runat="server" Text="Remove" OnClick="btnRemove_Click" />
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
</td>
</tr>
<tr>
<td colspan="2">
<asp:Label ID="lblMessage" runat="server" Font-Names="Verdana" Font-Size="Small" ForeColor="Red"></asp:Label>
</td>
</tr>
</table>
File. Uploader.ascx.cs
// General declarations
protected static ArrayList arrFiles = new ArrayList(); // has to be static since Adding and then reusing
protected int isUploaded = 0;
protected string pathToUpload = HttpContext.Current.Server.MapPath("UploadedFiles");
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnAdd_Click(object sender, EventArgs e)
{
// Functionality to add the item in the list
// At very first add to the array list & simultaneously display in the listbox
try
{
if (Page.IsPostBack)
{
arrFiles.Add(fUpload);
lstFiles.Items.Add(fUpload.PostedFile.FileName);
}
}
catch (Exception ex)
{
lblMessage.Text = "An error has occurred while adding a file: " + ex.Message;
}
}
protected void btnRemove_Click(object sender, EventArgs e)
{
// Functionality to remove files
// Very first you have to remove from the array list and similarly from the listbox
if (lstFiles.Items.Count != 0)
{
arrFiles.Remove(fUpload);
lstFiles.Items.Remove(lstFiles.SelectedItem.Text);
}
}
protected void btnUpload_Click(object sender, EventArgs e)
{
// Very first check if the files are present to upload or selected to upload
if ((lstFiles.Items.Count == 0) && (isUploaded == 0))
{
lblMessage.Text = "Please specify a file name";
}
else
{
// Take every element from the array list as HTMLInputFile, iterate through
// each InputFile and upload the files to the specified location
foreach (System.Web.UI.WebControls.FileUpload Ipf in arrFiles)
{
try
{
string strFileName = System.IO.Path.GetFileName(Ipf.PostedFile.FileName);
Ipf.PostedFile.SaveAs(pathToUpload + "\\" + strFileName);
isUploaded = isUploaded + 1;
}
catch (Exception ex)
{
lblMessage.Text = "An error has occurred while uploading your files:<br>" + ex.Message;
}
}
if (isUploaded == arrFiles.Count)
{
lblMessage.Text = "Files uploaded successfully";
}
// Empty the array list and listbox once the upload process finishes
arrFiles.Clear();
lstFiles.Items.Clear();
}
}
Accessing Code on Default.aspx page
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register TagPrefix="Bulk" TagName="Uploader" Src="Uploader.ascx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Bulk Uploader</title>
</head>
<body>
<form id="attachme" method="post" enctype="multipart/form-data" runat="server">
<div>
<h3>Bulk Files Uploader Utility:</h3>
<Bulk:Uploader runat="server" id="Uploader1"></Bulk:Uploader>
</div>
</form>
</body>
</html>