Dynamically Adding Controls to a Web Page...

原创 2004年10月06日 21:20:00

You may add controls to a web page dynamically as needed at run time rather than at design time. This short article shows you how.

By: John Kilgo spacer.gif Date: April 5, 2003spacer.gifdownload.gifspacer.gifDownload the code. spacer.gif <?XML:NAMESPACE PREFIX = ASP />spacer.gifPrinter Friendly Version

Sometimes when building a web form you do not know exactly how many controls of a certain type you will need on the form at run time. This problem can be easily solved by dynamically adding the forms at run time rather than adding them at design time. In this example we will use a simple interface to allow the user to state how many DropDownLists he or she wants on the web form. In real life you will probably determine based upon input from some other control(s) on the page. Either way the solution to the problem is the same.

As usual, lets get straight to the code. The .aspx file contains our <form> and allows the user to enter the number of DropDownLists to be created by the code-behind program. Following is the code for the .aspx page. The only thing of note here is the OnClick event for the button. It is here (in the code-behind page) that our controls will be created.

<%@ Page Language="vb" AutoEventWireup="false" Src="DynamicDropDowns.aspx.vb" Inherits="DynamicDropDowns"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<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">
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<h4>Enter Number of DropDownLists:</h4>
<asp:TextBox ID="txtNumControls" Runat="server" />
<asp:Button ID="btnControls" Text="OK" OnClick="btnControls_Click" Runat="server" />

Now for the code-behind page. As promised, all of the code to produce our DropDownLists appears in the button's Click event. Here we have two For...Next loops. The outer loop (I) creates the DropDownLists, sets their ID's, and then, below the inner loop (J) adds a <p> paragraph tag to add spacing between the controls, adds the litheral controls and adds the DropDownList controls themselves. The inner loop (J) simply adds some list items for each of the DropDownList controls. If you run the example program you will better see the list items that were added.

Public Class DynamicDropDowns : Inherits System.Web.UI.Page

  Protected WithEvents txtNumControls As System.Web.UI.WebControls.TextBox
  Protected WithEvents btnControls As System.Web.UI.WebControls.Button
  Protected WithEvents Form1 As System.Web.UI.HtmlControls.HtmlForm

  Public Sub btnControls_Click(ByVal sender As System.Object, ByVal e As System.EventArgs)
    Dim I, J As Integer

    For I = 1 to txtNumControls.Text
      Dim ctrlDropDown = New System.Web.UI.WebControls.DropDownList
      ctrlDropDown.ID = "ddlDynamic" & I
      For J = 1 To 4
        Dim listItem As New System.Web.UI.WebControls.ListItem
        listItem.Text = "DropDownList " & I & " : " & J
      Dim literalControl = New System.Web.UI.LiteralControl
      literalControl.Text = "<p>"
  End Sub

End Class

There you have it. DropDownLists added dynamically at runtime. You can, of course, add most any other type of control using this same method. You can also use panels to add even more controls and to better control their formatting.

You may run the program here.
You may download the code here.

Adding Controls to a DataGrid at Runtime

Adding Controls to a DataGrid at RuntimeAuthorDate Of SubmissionUser LevelTushar Ameta03/19/2002Inte...
  • qiaov
  • qiaov
  • 2004年11月05日 15:54
  • 843

Creating ASP.NET Controls Dynamically

Question: a) How to populate the data in ListBox from the database.b) How to display the relevant De...
  • fzzf
  • fzzf
  • 2005年11月12日 23:49
  • 645

Dynamically Adding Template columns to a GridView

IntroductionMany a times we wonder how to add template column dynamically. This might be the case wh...
  • Titan_koa
  • Titan_koa
  • 2007年02月08日 16:46
  • 559

Adding Controls to the Toolbar

Another common feature is to place SWT controls in the toolbar instead of just buttons. Again, the k...
  • liuchao1211
  • liuchao1211
  • 2010年05月14日 08:10
  • 434

java.lang.IllegalArgumentException: adding a window to a container

  • levelmini
  • levelmini
  • 2014年04月24日 09:55
  • 1738

解决 The Controls collection cannot be modified because the control contains code blocks (i.e. )问题

解决 The Controls collection cannot be modified because the control contains code blocks (i.e. )问题。...
  • broze
  • broze
  • 2011年02月24日 12:08
  • 3387

git adding files to index has encountered a problem

从国外博客 查到 http://www.metod.si/eclipse-adding-files-to-git-index-problem/ https://stackoverflow.c...
  • AlbertFly
  • AlbertFly
  • 2017年08月17日 10:54
  • 379

Adding Controls to Windows Forms at Runtime

  • pigHead_chen
  • pigHead_chen
  • 2008年05月09日 10:09
  • 280


74.Immediately after adding a new disk to or removing an existing disk from an ASM instance, you fin...
  • rlhua
  • rlhua
  • 2013年11月06日 16:31
  • 6605

What do 'statically linked' and 'dynamically linked' mean?

http://stackoverflow.com/questions/311882/what-do-statically-linked-and-dynamically-linked-mean ...
  • caolaosanahnu
  • caolaosanahnu
  • 2012年05月09日 15:21
  • 607
您举报文章:Dynamically Adding Controls to a Web Page...