Add Controls Dynamically - Part 2
Posted by gabriel,
Mon Jul 14 09:59:00 UTC 2008
This post continues what’s been done in the Part 1
On my last post I talked about creating controls dynamically in asp.net. In this post I’m going to continue with common issues or needs that users have based on what I noticed on the Asp.Net Forums
Related posts:- Add Controls Dynamically – Part 1
- Add Controls Dynamically – Part 2
- Add Controls Dynamically – Part 3
- Add Controls Dynamically – Part 4
- Add Controls Dynamically – Part 5
First I want to talk about assigning events to the controls that we are creating, this is a simple task but still and important topic.
Adding Events
The first thing we need to do is create a method that will be the handler for the event. When the event is fired on the control this is the method we want to be called to handle the event. In our example we are using TextBoxes so we want to handle the TextChanged event and make the background of the control yellow. Here is the method:
private void TextBox_TextChanged(object sender, EventArgs e)
{
//the sender is the control that fired the event
//that is the control we want to change the color
TextBox tb = (TextBox)sender;
tb.BackColor = System.Drawing.Color.Yellow ;
}
The name of the method is irrelevant but it’s return type and parameters are not. If you create an event through VisualStudio you’ll notice that the signature of the method is the same.
Now that we have the method we need to set this method as the handler for the event on the controls that we are creating. Adding the method to the controls handler is as simples as this:
tb.TextChanged += TextBox_TextChanged;
If you add your controls now all of them will have this handler and it’s background will turn yellow (after submit) if you change the content of the textbox.
PlaceHolder
Up until now we’ve been adding the controls directly to the Form. This will cause the controls to be added to the end of the page after all other controls. This is fine as an example but might not be you desired result. We will you the PlaceHolder control as a container to our controls, this way we can put the PlaceHolder wherever we want in the page and the controls will be added within it.
Another advantage of the PlaceHolder control is that it doesn’t generate any html, it’s just the to serve (as it’s own name says) as a place holder. So you don’t need to worry about adding extra html just to have a place to put your controls in.
In our example I will put the PlaceHolder before the button that we are using just to show that the controls will no longer be added to the end of the page.
The new page with the events and the PlaceHolder control will be like this:
<script runat="server">
void Page_Load(object sender, EventArgs e)
{
//when the user first enters the page set the count as zero
if (!IsPostBack)
{
ViewState["count"] = 0;
}
//on every subsequent postback, check the control count
//and recreated all the controls
else
{
int controlCount = (int)ViewState["count"];
for (int i = 0; i < controlCount; i++)
{
createDynamicControls();
}
}
}
protected void Button1_Click(object sender, EventArgs e)
{
createDynamicControls();
//increment the number of controls
ViewState["count"] = (int)ViewState["count"] + 1;
}
//this method takes care of creating the controls
private void createDynamicControls()
{
TextBox tb = new TextBox();
tb.TextChanged += TextBox_TextChanged;
PlaceHolder1.Controls.Add(tb);
}
private void TextBox_TextChanged(object sender, EventArgs e)
{
//the sender is the control that fired the event
//that is the control we want to change the color
TextBox tb = (TextBox)sender;
tb.BackColor = System.Drawing.Color.Yellow ;
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
<asp:Button ID="Button1" runat="server" Text="Add TextBox"
onclick="Button1_Click" />
</div>
</form>
</body>
</html>
Stay tuned for more about dynamically created controls.
