Adding Controls at Run Time

A control can contain other controls. You might want to read this twice: Controls based on the Control class contain a Controls collection that holds the controls contained in the control, if any. For example, the Web form Page class is derived from the Control class, so you can add controls to a Web form with the form's Controls.Add method. In fact, placeholder controls are designed to be used this way—they don't insert any HTML into a Web page themselves, but you can add controls to them with their Controls.Add method.

You can see how this works in the AddControls example on the CD-ROM, which you can see in Figure 15.11. When you click the button in this example, two text boxes are added to the Web form. One text box is added to a place holder, and one to a panel control, which is also used for this purpose.

Figure 15.11: The AddControls example.

Here is the WebForm1.aspx file for the AddControls project:

<%@ Page Language="vb" AutoEventWireup="false" Codebehind=
"WebForm1.aspx.vb" Inherits="AddControls.WebForm1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
  <HEAD>
    <title></title>
    <meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0">
    <meta name="CODE_LANGUAGE" content="Visual Basic 7.0">
    <meta name=vs_defaultClientScript content="JavaScript">
    <meta name=vs_targetSchema
        content="http://schemas.microsoft.com/intellisense/ie5">
  </HEAD>
  <body MS_POSITIONING="GridLayout">

    <form id="Form1" method="post" runat="server">
<asp:Button id=Button1 style="Z-INDEX: 101; LEFT: 99px;
POSITION: absolute; TOP: 105px" runat="server" Text="Click me">
</asp:Button>
<asp:Panel id=Panel1 style="Z-INDEX: 102; LEFT: 275px;
POSITION: absolute; TOP: 105px" runat="server" Width="128px"
Height="26px"></asp:Panel>
<asp:PlaceHolder id=PlaceHolder1 runat="server">
</asp:PlaceHolder>

    </form>
  </body>
</HTML>

And here's the WebForm1.aspx.vb file:

Public Class WebForm1
    Inherits System.Web.UI.Page
    Protected WithEvents Button1 As System.Web.UI.WebControls.Button
    Protected WithEvents PlaceHolder1 As _
        System.Web.UI.WebControls.PlaceHolder
    Protected WithEvents Panel1 As System.Web.UI.WebControls.Panel

#Region " Web Form Designer Generated Code "

    'This call is required by the Web Form Designer.
    <System.Diagnostics.DebuggerStepThrough()> _
        Private Sub InitializeComponent()

    End Sub

    Private Sub Page_Init(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles MyBase.Init
        'CODEGEN: This method call is required by the Web Form Designer
        'Do not modify it using the code editor.
        InitializeComponent()
    End Sub

#End Region
    Dim TextBox1, TextBox2 As New _
        System.Web.UI.WebControls.TextBox()

    Private Sub Page_Load(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles MyBase.Load
        'Put user code to initialize the page here
    End Sub

    Private Sub Button1_Click(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles Button1.Click
        TextBox1.Text = "TextBox1"
        TextBox2.Text = "TextBox2"
        TextBox1.Style("POSITION") = "ABSOLUTE"
        TextBox1.Style("TOP") = "60px"
        TextBox1.Style("LEFT") = "150px"
        PlaceHolder1.Controls.Add(TextBox1)
        Panel1.Controls.Add(TextBox2)
    End Sub
End Class

In this example, I've added a placeholder control, PlaceHolder1, and a panel control, Panel1. Web form panels act just like Windows form panels, and they're frequently used as a container control for other controls. (We'll see Web form panels in Chapter 16.) Here's how this example works—the code creates two text boxes, like this:

    Dim TextBox1, TextBox2, TextBox3 As New _
        System.Web.UI.WebControls.TextBox()

    Private Sub Button1_Click(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles Button1.Click
        TextBox1.Text = "TextBox1"
        TextBox2.Text = "TextBox2"
        ⋮
    End Sub

Then I add a new control to the place holder and to the panel using the Controls.Add method. By default, place holders don't have a position in the Web page, so note that I also position the text box inserted into the place using its Style property to place the text box in the position I want (see "Moving Controls" in this chapter for more information):

    Dim TextBox1, TextBox2 As New _
        System.Web.UI.WebControls.TextBox()

    Private Sub Button1_Click(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles Button1.Click
        TextBox1.Text = "TextBox1"
        TextBox2.Text = "TextBox2"
        TextBox1.Style("POSITION") = "ABSOLUTE"
        TextBox1.Style("TOP") = "60px"
        TextBox1.Style("LEFT") = "150px"
        PlaceHolder1.Controls.Add(TextBox1)
        Panel1.Controls.Add(TextBox2)
    End Sub

And that's all it takes. If you want to add an event handler to a new control, use the AddHandler method, as we've done in Windows forms.

*Related solution:*	*Found on page:*
Adding and Removing Controls at Run Time	196