This code example is used to demonstrate how to load ASP.NET user controls to a page dynamically. At the end of this post you can download the sample project.

The screen shot below contains three makes of cars Ford, Chevy, and Dodge and asks users to pick a model and type in some comments.  This is actually one user control added to the page dynamically three times. 

Here is a screen shot of the user control. 

Adding The Control to the ASPX Page

When you add the control the parent page, This is Key, you must do the load from the Page_Init() method.  This way it will get added to the viewstate of the site. If you add it in Page_Load() for example you will not be able to get the values of the user control in the Save() method. 

The AddControlToPage() method will call the user control multple times to load the values.

Loading The Control

The user control has a SetupControl() method that accepts two parameters.   The first one tells the user control to load values from the database, and the second value is the vehicle manufacturer.

The reason for the "load from database" flag is that when you load a user control dynamically you need to populate values of labels and drop down items after each post-back.  You only want to pull from the database on the first load of the page.  On all subsequent page loads you still need to load all the items to the drop down but you do not want to override any user input.   No worries, when you reload the drop downs ASP.NET remembers the user last selection.   The point of reloading the drop down is to get all the values back in the drop down list. 

The point to remember about adding controls to the page dynamically is to do this from the Page_Init method.  You can spend a good deal of time wondering why you cannot get to the values of the control or why the values entered in text boxes are gone when attempting to perform the load outside of Page_Init.

DynamicUC.zip (173.99 kb)

I had a user control embedded in an ASPX (parent) page as a hidden layer. The control was placed inside of a panel control that was hidden. The parent page would load an show the user control

Once the user completed the work they clicked "Close Window" that would raise an event on the parent page, and  the parent page would hide the hidden layer.

1. User Control (ASCX): Add the following delegates and events

// Delegate declaration  
public delegate void OnButtonClick(string strValue);          
// Event declaration  
public event OnButtonClick btnHandlerEditAccount;

2. User Control (ASCX): Button close event will raise btnHandlerEditAccount causing the parent page to hide the panel with the user control.  

protected void BtnCloseWindow_Click(object sender, EventArgs e)
{
   //Make the parent close the window
   if (btnHandlerEditAccount != null) btnHandlerEditAccount(string.Empty);
            
}

3. Parent Page: Handles btnHandlerEditAccount from the user control.

//Event Handlers to close windows from user controls (place in Page_Load)
UCEditAccountInfo.btnHandlerEditAccount += new EditAccountInfo.OnButtonClick(UCEditAccount_btnHandler);

//Syntax of item above: UserControlName dropped on the page += new Class.NameOfActualUserControl.OnButtonClick(handler created in step 1)

/// 

/// Handle the Window Close on the Edit Account User Control
/// 
protected void UCEditAccount_btnHandler(string strValue)
{
     PnlGrid.Enabled = true;
     PnlAccountEdit.Visible = false;
     ReloadGrid(false);
}