Uploading Multiple Files in ASP.NET 2.0: Part II

Rahul Kumar Saxena

12y53.5k16100Article

File Upload FileUpload ControlUpload ImageMultiple File Uploadfile upload in asp.net

16 Comments

Join the conversation! Your thoughts help the community grow.

Former member13y ago
http://www.dotnetpools.com/2012/09/fileupload-control-in-aspnet.html
Nivethitha13y ago
very nice article
selvi subramanian14y ago
ya itz nice .i need to upload a image and a resume using asp.net c#
narendra reddy14y ago
nice tutorial bro
subhash jakhar14y ago
How we can validate upload only 3 file
vasu dandamudi15y ago
Hi Rahul here i have one problem, if i select one file then i click on add to select one more file previous selected file is missing.any solution for that
haranath reddy16y ago
Thanks for this usefull one
- aditya mishra16y ago
  bvcbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
Santhosha HP17y ago
hi
danny dror17y ago
very helpful article, thanks! --------------------------------- Danny, Los Angeles Locksmith
prachi17y ago
Hey, It worked absolutely fine but there is one problem that when i fill one textbox with browse button and THEN click add button ,then it deletes context of the previous feilds like earlier file filled is gone. Any solution for that?
Hector17y ago
Hi, i wrote the code in a page in my site, it works fine, but when I selected som file with one of the fileuploaders and try to delete or add a new item, the page stop working and show me an error "Internet Explorer can not display the page". Another question, why do you always delete the row #1? if I have something selected it will be lost. Thanks. Hector
hitesh motwani17y ago
Hi, I m doing my last year project in visual studio using c#. its a website. I m unable to make it impressive pl help me with how to make more impressive and code also pl
- Rahul Kumar Saxena17y ago
  Hi hitesh, H R U Which type of website u r making
kalpana reddy17y ago
I really like Ur article,its nice
- Rahul Kumar Saxena17y ago
  Thanx KALPANA

PART I

In ASP.NET 2.0, the FileUpload control enables the users to upload files from web pages. The FileUpload control consists of a text box and a browse button. A click on the button allows the users to select a file on the client and upload it to the server. Here, I am representing a functionality to provide a right to the user to upload any number of images.

Let us start with uploading multiple files on a single button click.

Follow these 2 steps:

Here is the aspx code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Make Multiple Upload Images</title>

function DecreaseRow(rowNo)

{

var hid = document.getElementById('<%= hidCurRow.ClientID %>');

hid.value = rowNo;

}

function IncreseRows()

{

var hid = document.getElementById('<%= hidCurRow.ClientID %>');

hid.value = "";

}

function SetZero()

{

var hid = document.getElementById('<%= hidCurRow.ClientID %>');

hid.value = "0";

}

</script>

</head>

<body>

<tr>

<td>

<asp:Table ID="tblMin" runat="server">

<asp:TableHeaderRow>

<asp:TableHeaderCell>

File

</asp:TableHeaderCell>

<asp:TableHeaderCell>

Remove

</asp:TableHeaderCell>

</asp:TableHeaderRow>

<asp:TableRow>

<asp:TableCell>

<asp:FileUpload ID="fu1" runat="server" />

</asp:TableCell>

<asp:TableHeaderCell>

<asp:Button ID="btn1" runat="server" Text="Remove" OnClientClick="return DecreaseRow('1');" />

</asp:TableHeaderCell>

</asp:TableRow>

</asp:Table>

<asp:Button ID="btnAdd" runat="server" OnClick="btnAdd_Click" Text="Add" OnClientClick="return IncreseRows();" />

<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click"

OnClientClick="SetZero();" /><br />

<asp:HiddenField ID="hidMax" runat="server" Value="1" />

<asp:HiddenField ID="hidRow" runat="server" Value="1" />

<asp:HiddenField ID="hidCurRow" runat="server" />

</td>

</tr>

</table>

</form>

</body>

</html>

This is the cs code:

using System;

using System.Data;

using System.Configuration;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.IO;

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

if (Page.IsPostBack == true)

{

AddRows();

}

private void AddRows()

{

try

{

if (hidCurRow.Value != "" && hidCurRow.Value != "0")

{

DecreaseCount();

}

else if (hidCurRow.Value == "")

{

IncreaseCount();

}

for (int count = 1; count < tblMin.Rows.Count; count++)

{

tblMin.Rows.RemoveAt(1);

}

int maxRows = Convert.ToInt32(hidMax.Value);

string[] arrRows = hidRow.Value.Split(",".ToCharArray(), StringSplitOptions.RemoveEmptyEntries);

for (int count = 1; count <= maxRows; count++)

{

Boolean isAdd = false;

for (int incount = 0; incount < arrRows.Length; incount++)

{

if (arrRows[incount] == count.ToString())

{

isAdd = true;

break;

}

if (isAdd == true)

{

TableRow tr = new TableRow();

TableCell tcfu = new TableCell();

FileUpload fup = new FileUpload();

fup.ID = "fu" + count.ToString();

tcfu.Controls.Add(fup);

TableCell tcbtn = new TableCell();

Button bt = new Button();

bt.ID = "btn" + count.ToString();

bt.Text = "Remove";

bt.Attributes.Add("onclick", "DecreaseRow('" + count.ToString() + "');");

tcbtn.Controls.Add(bt);

tr.Cells.Add(tcfu);

tr.Cells.Add(tcbtn);

tblMin.Rows.Add(tr);

}

catch

{

}

private void IncreaseCount()

{

string strVal = hidMax.Value;

if (strVal != "")

{

int iMax = Convert.ToInt32(strVal);

iMax = iMax + 1;

hidMax.Value = iMax.ToString();

if (hidRow.Value != "")

{

hidRow.Value = hidRow.Value + "," + iMax.ToString();

}

else

{

hidRow.Value = iMax.ToString();

}

private void DecreaseCount()

{

string strCurRow = hidCurRow.Value;

string[] arrRows = hidRow.Value.Split(",".ToCharArray(), StringSplitOptions.RemoveEmptyEntries);

hidRow.Value = "";

for (int count = 0; count < arrRows.Length; count++)

{

if (arrRows[count] != strCurRow)

{

if (hidRow.Value == "")

{

hidRow.Value = arrRows[count];

}

else

{

hidRow.Value = hidRow.Value + "," + arrRows[count];

}

protected void btnAdd_Click(object sender, EventArgs e)

{

}

protected void btnSubmit_Click(object sender, EventArgs e)

{

if (hidRow.Value != "")

{

string[] strVal = hidRow.Value.Split(",".ToCharArray(), StringSplitOptions.RemoveEmptyEntries);

for (int count = 0; count < strVal.Length; count++)

{

FileUpload fup = new FileUpload();

fup = (FileUpload)tblMin.FindControl("fu" + strVal[count]);

if (fup != null)

{

if (fup.PostedFile != null && fup.FileName != "")

{

fup.SaveAs(Server.MapPath("MyFiles") + "\\" + Path.GetFileName(fup.FileName));

}

When, we run the Apllication, result will be:

Image 1.

Here, user can add many upload controls by clicking on Add button and even he can remove the upload controls by clicking on Remove button.

Image 2.