简单测试动态控制控件(用JS添加客户端控件,用C#在后台获取控件的录入值)
测试版本:vs.net2008
阅读图书:ASP.NET 3.5 实例精通 P191多文件上传 8-02.aspx
书中代码测试:
aspx文件:
<form id="form1" runat="server" enctype="multipart/form-data">
<script type="text/javascript">
function addForm()
{
var strForm = "<br /><input type='file' size='50' name='File' />";
document.getElementById("MyFile").insertAdjacentHTML("beforeEnd", strForm);
}
</script>
<p id="MyFile">
<input type="file" size="50" name="File" />
</p>
<p>
<input type="button" value="增加一个" onclick="addForm()" />
<asp:Button ID="Button1" runat="server" Text="开始上传" onclick="Button1_Click" />
<input onclick="this.form.reset()" type="button" value="重置" />
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
</p>
</form>
aspx.cs文件:
protected void Button1_Click(object sender, EventArgs e)
{
SaveFiles();
}
private void SaveFiles()
{
//遍历表单元素
HttpFileCollection files = HttpContext.Current.Request.Files;
//状态信息
string strout = "<br />上传的文件分别是:<hr /><table><tr><td>文件类型</td><td>客户端地址</td><td>上传文件名</td><td>扩展名</td></tr>";
try
{
for (int iFile = 0; iFile < files.Count; iFile++)
{
//访问单独文件
HttpPostedFile postedFile = files[iFile];
string fileName, fileExtension;
fileName = System.IO.Path.GetFileName(postedFile.FileName);
if (fileName != "")
{
fileExtension = System.IO.Path.GetExtension(fileName);
strout += "<tr><td>" + postedFile.ContentType + "</td>";
strout += "<td>" + postedFile.FileName + "</td>";
strout += "<td>" + fileName + "</td>";
strout += "<td>" + fileExtension + "</td></tr>";
//保存文件到服务器
postedFile.SaveAs(Server.MapPath("uploadFile/") + fileName);
}
else
{
strout = "<br />请您选择一个文件";
}
Label1.Text = strout;
}
}
catch (Exception ex)
{
Label1.Text = ex.Message;
}
}
根据书中代码做的扩展测试,在客户端添加type="text"的input控件,在服务器端获取他们的录入值,这个经常可以用于列表数据的录入,以前我是用给GridView绑定DataTable的方法做的(该方法见:http://www.nnllok.cn/myBlog/archives/2007/3399.html)
测试代码:
aspx文件:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CreateClientControl.aspx.cs" Inherits="CreateClientControl" %>
<!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 runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<script type="text/javascript">
var i = 1;
function addTxtInput()
{
i++;
var strTxtInput = "<br /><input type='text' name='myTxt" + i + "' />";
document.getElementById("TxtContainer").insertAdjacentHTML("beforeEnd", strTxtInput);
}
</script>
<div id="TxtContainer">
<input type="text" name="myTxt1" />
</div>
<div>
<input type="button" value="增加一个" onclick="addTxtInput()" />
<asp:Button ID="Button1" runat="server" Text="获取每个text控件的值" onclick="Button1_Click" />
<input type="reset" value="重置" />
<br />
<asp:Literal ID="LtResult" runat="server"></asp:Literal>
</div>
</form>
</body>
</html>
aspx.cs文件:
protected void Button1_Click(object sender, EventArgs e)
{
string[] keys = Request.Form.AllKeys;
foreach (string key in keys)
{
Response.Write("<br>" + key + ":");
if (key.StartsWith("myTxt"))
{
Response.Write(Request.Form[key]);
}
}
}