动态添加控件(二)点击按钮来添加子控件
如果直接在网页上添加一个按钮,再把上章中的
CheckBoxList myList = new CheckBoxList();
myList.Items.Add(new ListItem("男","男"));
myList.Items.Add(new ListItem("女","女"));
this.Panel1.Controls.Add(myList);
加入到Button1_Click事件去的话,运行时,您会发现一个问题,无论您怎么点击按钮,都只会添加一个子控件。这是因为PostBack的时候,Panel被重载的原因,所以,如果要点击按钮添加子控件的话,就必须和别的控件相结合,下面以DataList为例说明。
先添加一个ControlsAdd.aspx页面。在页面里拖入一个DataList控件和一个Button控件。
进入ControlsAdd.aspx.cs页面,在Page_Load事件里建立一个DataTable,这个DataTable用于DataList的绑定,每次点击按钮,则增加一个DataTable的行,再和DataList绑定。
现在在Page_Load事件里输入以下代码:
if (!this.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.Add("abb");
DataRow row = dt.NewRow();
ViewState["dt"] = dt;
}
然后回到ControlsAdd.aspx,双击按钮,在Button1_Click事件里加入以下代码:
DataTable dt = (DataTable)ViewState["dt"];
DataRow row = dt.NewRow();
dt.Rows.Add(row);
ViewState["dt"] = dt;
this.DataList1.DataSource = dt;
this.DataList1.DataBind();
该代码是给DataTalbe添加行,并和DataList绑定的。现在再回到ControlsAdd.aspx,选择DataList,再属性选择的ItemCreated行为里双击,然后在DataList1_ItemCreated事件里加入以下代码:
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
TextBox tb = new TextBox();
e.Item.Controls.Add(tb);
}
编译后看看效果吧。以下是完整的代码:
ControlsAdd.aspx:
<%@ Page language="c#" Codebehind="ControlsAdd.aspx.cs" AutoEventWireup="false" Inherits="test.ControlsAdd" %>
<!DOCTYPE HTML PUBLIC "-//W
<HTML>
<HEAD>
<title>ControlsAdd</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
</HEAD>
<body>
<form id="Form1" method="post" runat="server">
<FONT face="宋体">
<asp:DataList id="DataList1" runat="server"></asp:DataList>
<P>
</FONT>
<asp:Button id="Button1" runat="server" Text="Button"></asp:Button></P>
<P><FONT face="宋体"></FONT> </P>
</form>
</body>
</HTML>
ControlsAdd.aspx.cs:
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace test
{
/// <summary>
/// ControlsAdd 的摘要说明。
/// </summary>
public class ControlsAdd : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataList DataList1;
protected System.Web.UI.WebControls.Button Button1;
private void Page_Load(object sender, System.EventArgs e)
{
if (!this.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.Add("abb");
DataRow row = dt.NewRow();
ViewState["dt"] = dt;
}
}
#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.DataList1.ItemCreated += new System.Web.UI.WebControls.DataListItemEventHandler(this.DataList1_ItemCreated);
this.Button1.Click += new System.EventHandler(this.Button1_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void Button1_Click(object sender, System.EventArgs e)
{
DataTable dt = (DataTable)ViewState["dt"];
DataRow row = dt.NewRow();
dt.Rows.Add(row);
ViewState["dt"] = dt;
this.DataList1.DataSource = dt;
this.DataList1.DataBind();
}
private void DataList1_ItemCreated(object sender, System.Web.UI.WebControls.DataListItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
TextBox tb = new TextBox();
e.Item.Controls.Add(tb);
}
}
}
}