Load User Controls Dynamically in ASP.NET, C#
In my previous article I explained about how to load user controls on page load itself. But sometimes we may have requirement like on button click of Asp.Net page we have to load user control. We can achieve this functionality by using Pgae.LoadControl() method.
To load the user control dynamically in C#, we have to provide the path of the user control for the Page.LoadControl() method as shown below.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Loading the Web User Controls Dynamically in ASP.NET</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="btn1" Text="Click For First User Control" runat="server" OnClick="btn1_Click" />
<br /><br />
<asp:PlaceHolder ID="plh1" runat="server"></asp:PlaceHolder>
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (IsUserControl)
CreateUserControl();
}
protected void btn1_Click(object sender, EventArgs e)
{
CreateUserControl();
IsUserControl = true;
}
private void CreateUserControl()
{
Control featuredProduct = Page.LoadControl("WebUserControl.ascx");
plh1.Controls.Add(featuredProduct);
}
private bool IsUserControl
{
get
{
if (ViewState["IsUserControl"] != null)
{
return (bool)ViewState["IsUserControl"];
}
else
{
return false;
}
}
set
{
ViewState["IsUserControl"] = value;
}
}
}
As shown above, we have the asp.net user control WebUserControl.ascx and loading the user control on button click, adding this user control to place holder plh1. We are changing the IsUserControl property value to true on button click event. Based on IsUserControl value we will attach the user control to the placeholder plh1 for webusercontrol click event. If you click the webusercontrol button, then it displays the message "The User Control Loaded Dynamically".
If you want to fire the button click event of user control you have to attach the webusercontrol to parent page for each page load. For that we maintain IsUserControl property in the above example.
