I'm creating a .net program that uploads images to the FTP server. A blank listbox is populated dynamically on the client side from the value of the html input file widget. There is also a requiredfieldva lidator on the listbox to make sure there is an item in the listbox. When I click the button to submit, however, the listbox clears itself and a validation error shows. Below is the relevant code in C# plus the Javascript code. Thanks in advance.
.aspx code:
[code=asp]
<%@ Page Language="C#" ContentType="te xt/html" ResponseEncodin g="utf-8" CodeFile="logop ageAdmin.aspx.c s" Inherits="_Defa ult" trace=true %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitl ed Document</title>
</head>
<body>
<form id="attachme" method="post" encType="multip art/form-data" runat="server">
<div id="fileSelecti on">
<input type="file" id="fileDialog " name="fileDialo g" />
<input id="addFile" name="addFile" type="button" value="Add" onclick="addToL ist()" />
</div>
<div id="listEdit">
<asp:ListBox ID="uploadList " runat="server" Rows="10" ValidationGroup ="uploadSelecti on"></asp:ListBox><br/>
<asp:RequiredFi eldValidator ID="reqUpload" runat="server" ControlToValida te="uploadList " InitialValue="" EnableClientScr ipt="true" Display="Dynami c" ErrorMessage="P lease select files to upload<br/>" ValidationGroup ="uploadSelecti on" />
<input type="button" id="removeItem " name="removeIte m" value="Remove Selected Files" onclick="remove FromList()" />
<asp:Button ID="upload" runat="server" Text="Upload Files" OnClick="Upload _ServerClick" ValidationGroup ="uploadSelecti on" />
</div>
<asp:TextBox ID="status" runat="server" TextMode="Multi Line" Rows="10" Columns="60" Wrap="true" Enabled="false" />
...
</form>
</body>
</html>
[/code]
C# code:
[code=cpp]
protected void Page_Load(objec t sender, EventArgs e)
{
Page.RegisterCl ientScriptBlock ("logopageAdmin Main", "<script type=\"text/javascript\" src=\"logopageA dminScript.js\" ></script>");
...
}
public void Upload_ServerCl ick(object sender, System.EventArg s e)
{
foreach (ListItem i in uploadList.Item s)
{
try
{
//testing to see if listbox items are read
Response.Write( i.Value + "<br/>");
//upload code here
}
catch(Exception err)
{
//do code
}
}
}
[/code]
javascript code:
[code=javascript]
var listWidget;
function addToList()
{
var fileWidget = document.getEle mentById("fileD ialog");
listWidget = document.getEle mentById("uploa dList");
if (fileWidget.val ue.substring(fi leWidget.value. length - 4) == ".jpg" || fileWidget.valu e.substring(fil eWidget.value.l ength - 4) == ".gif" || fileWidget.valu e.substring(fil eWidget.value.l ength - 4) == ".png")
{
var newOption = document.create Element("Option ");
newOption.text = fileWidget.valu e;
newOption.value = fileWidget.valu e;
listWidget.opti ons[listWidget.leng th] = newOption;
}
else
{
alert("Files must be either .jpg, gif, or .png");
}
}
function removeFromList( )
{
listWidget = document.getEle mentById("uploa dList");
for (var i = listWidget.leng th - 1; i>=0; i--)
{
if (listWidget.opt ions[i].selected)
{
listWidget.remo ve(i);
}
}
}[/code]
.aspx code:
[code=asp]
<%@ Page Language="C#" ContentType="te xt/html" ResponseEncodin g="utf-8" CodeFile="logop ageAdmin.aspx.c s" Inherits="_Defa ult" trace=true %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitl ed Document</title>
</head>
<body>
<form id="attachme" method="post" encType="multip art/form-data" runat="server">
<div id="fileSelecti on">
<input type="file" id="fileDialog " name="fileDialo g" />
<input id="addFile" name="addFile" type="button" value="Add" onclick="addToL ist()" />
</div>
<div id="listEdit">
<asp:ListBox ID="uploadList " runat="server" Rows="10" ValidationGroup ="uploadSelecti on"></asp:ListBox><br/>
<asp:RequiredFi eldValidator ID="reqUpload" runat="server" ControlToValida te="uploadList " InitialValue="" EnableClientScr ipt="true" Display="Dynami c" ErrorMessage="P lease select files to upload<br/>" ValidationGroup ="uploadSelecti on" />
<input type="button" id="removeItem " name="removeIte m" value="Remove Selected Files" onclick="remove FromList()" />
<asp:Button ID="upload" runat="server" Text="Upload Files" OnClick="Upload _ServerClick" ValidationGroup ="uploadSelecti on" />
</div>
<asp:TextBox ID="status" runat="server" TextMode="Multi Line" Rows="10" Columns="60" Wrap="true" Enabled="false" />
...
</form>
</body>
</html>
[/code]
C# code:
[code=cpp]
protected void Page_Load(objec t sender, EventArgs e)
{
Page.RegisterCl ientScriptBlock ("logopageAdmin Main", "<script type=\"text/javascript\" src=\"logopageA dminScript.js\" ></script>");
...
}
public void Upload_ServerCl ick(object sender, System.EventArg s e)
{
foreach (ListItem i in uploadList.Item s)
{
try
{
//testing to see if listbox items are read
Response.Write( i.Value + "<br/>");
//upload code here
}
catch(Exception err)
{
//do code
}
}
}
[/code]
javascript code:
[code=javascript]
var listWidget;
function addToList()
{
var fileWidget = document.getEle mentById("fileD ialog");
listWidget = document.getEle mentById("uploa dList");
if (fileWidget.val ue.substring(fi leWidget.value. length - 4) == ".jpg" || fileWidget.valu e.substring(fil eWidget.value.l ength - 4) == ".gif" || fileWidget.valu e.substring(fil eWidget.value.l ength - 4) == ".png")
{
var newOption = document.create Element("Option ");
newOption.text = fileWidget.valu e;
newOption.value = fileWidget.valu e;
listWidget.opti ons[listWidget.leng th] = newOption;
}
else
{
alert("Files must be either .jpg, gif, or .png");
}
}
function removeFromList( )
{
listWidget = document.getEle mentById("uploa dList");
for (var i = listWidget.leng th - 1; i>=0; i--)
{
if (listWidget.opt ions[i].selected)
{
listWidget.remo ve(i);
}
}
}[/code]
Comment