Navigator : Home > Tutorials > Controls Tutorials > ...
Creating dynamic controls using ASP.NET 2.0 and C# .NET
This tutorial will show you how to create dynamic, persistent, web controls on the fly using ASP.NET 2.0 and C#.NET
We moved our web sites to Server Intellect and have found them to be incredibly professional. Their setup is very easy and we were up and running in no time.
In some development situations you may not know how many controls you need ahead of time. In these cases it is easier to dynamically create web controls in a container control (such as a Panel) on your form while your application is running. To do this we do not need to be importing any special namespaces, however one implication of creating dynamic controls is that the dynamic controls you create are not preserved after postbacks so you will need some mechanism to remember the controls they've created dynamically. One way to do is using a simple array, and this is what we'll use in the following example. First in our _Default class we will declare a static Button array member called btn_arr, and a static int called btn_count. btn_arr will hold a copy of the controls we create on-the-fly and btn_count will keep track of how many new controls we create.
public partial class _Default : System.Web.UI.Page
{
static Button[] btn_arr = new Button[20];
static int btn_count;
... |
In the Page_Load event, we will read our button array and re-create all of the dynamic controls we stored in it. In this example, we read each array item into a Button object and use the Controls.Add() method of our container control (pnlMain) to add them to that controls collection.
protected void Page_Load(object sender, EventArgs e)
{
try {
if (btn_arr[0] is Button) {
//for each button saved in our array, recreate it foreach (Button button in btn_arr) {
add_button(button); } } } catch (Exception ex) {
lblStatus.Text += ex.Message.ToString(); }
protected void add_button(Button button)
{
try {
//add to a container on the page
pnlMain.Controls.Add(button);
//add a spacer after the control
pnlMain.Controls.Add(new LiteralControl("<br>")); } catch (Exception ex) {
lblStatus.Text += ex.Message.ToString(); } |
Need help with Windows Dedicated Hosting? Try Server Intellect. I'm a happy customer!
When we actually click on our btnSubmit button the real work happens. We instantiate a new Button type and assign it some initial values taken from the UI. It is then stored in our btn_arr and passed off to our add_button() function which adds it to the Panel control's collection.
On the front end we have a couple of text boxes that ask for the control ID, Text, and ForeColor. We also have a submit button and a label. The front end .aspx page looks something like this:
<table width="600" border="0" align="center" cellpadding="5" cellspacing="1" bgcolor="#cccccc">
<tr>
<td width="100" rowspan="2" align="right" bgcolor="#eeeeee" class="header1"> Web
Control added Dynamically:</td>
<td align="center" bgcolor="#FFFFFF"> <br />
<asp:Panel ID="pnlMain" runat="server" Height="300px" Width="500px">
</asp:Panel>
<br /> &namp;bsp;
</td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF">
<asp:button ID="btnSubmit" runat="server" Text="Create Button" OnClick="btnSubmit_Click" />Button
ID:
<asp:TextBox ID="txtID" runat="server" Width="64px"></asp:TextBox>
Button Color:<asp:TextBox ID="txtForeColor" runat="server" Width="64px"></asp:TextBox> <br />
Button Text:<asp:TextBox ID="txtText" runat="server" Width="64px"></asp:TextBox> <br />
<asp:label ID="lblStatus" runat="server"></asp:label> </td>
</tr>
</table> |
The flow for the code behind page is as follows.
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class _Default : System.Web.UI.Page
{
static Button[] btn_arr = new Button[20]; static int btn_count; protected void Page_Load(object sender, EventArgs e) {
try {
if (btn_arr[0] is Button) {
//for each button saved in our array, recreate it foreach (Button button in btn_arr) {
add_button(button); } } } catch (Exception ex) {
lblStatus.Text += ex.Message.ToString(); } } protected void add_button(Button button) {
try {
//add to a container on the page
pnlMain.Controls.Add(button);
//add a spacer after the control
pnlMain.Controls.Add(new LiteralControl("<br>")); } catch (Exception ex) {
lblStatus.Text += ex.Message.ToString(); } } protected void btnSubmit_Click(object sender, EventArgs e) {
try {
//create a new instance of the control
Button new_button = new Button();
new_button.ID = txtID.Text;
new_button.ForeColor = System.Drawing.Color.FromName(txtForeColor.Text);
new_button.Text = txtText.Text;
//add button to button array
btn_arr[btn_count++] = new_button;
//call our add function
add_button(new_button);
lblStatus.Text += "Created button " + new_button.ID + " and of color " + new_button.ForeColor; } catch (Exception ex) {
lblStatus.Text += ex.Message.ToString(); } } |
I just signed up at Server Intellect and couldn't be more pleased with my Windows Server! Check it out and see for yourself.
Looking for the VB.NET 2005 Version? Click Here!
Looking for more ASP.NET Tutorials? Click Here!