New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Loading User Controls

Login Tasks Search
Hint: Use "user" for the user name and "pass" for the password

User Name
Password

Not logged yet.
Loading user controls dynamically is one of the most common scenarios in ASP.NET programming. This example demonstrates how to achieve the desired functionality in a straightforward and simple way with the RadAjaxPanel control. You can also use the RadAjaxManager for the same purpose – you will need to AJAX-enable a standard ASP:Panel and then load the user controls within.
  • DefaultCS.aspx
  • LoginCS.ascx
    • LoginCS.ascx
    • SearchCS.ascx
    • TasksCS.ascx
  • DefaultCS.aspx.cs
    • DefaultCS.aspx.cs
    • LoginCS.ascx.cs
    • SearchCS.ascx.cs
    • TasksCS.ascx.cs
  • styles.css
<%@ Page Language="c#" CodeFile="DefaultCS.aspx.cs" AutoEventWireup="false" Inherits="Telerik.AJAXExamplesCSharp.AJAX.Examples.Common.LoadingUserControls.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="styles.css" type="text/css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-narrow no-bg">
        <div class="panelContainer">
            <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="LoadingPanel1">
                <div class="tabsContainer">
                    <asp:LinkButton ID="lbLogin" runat="server" CssClass="tabButton"><img src="Images/btnLogin.gif" alt="Login"/></asp:LinkButton>
                    <asp:LinkButton ID="lbTasks" runat="server" CssClass="tabButton"><img src="Images/btnTasks.gif" alt="Tasks"/></asp:LinkButton>
                    <asp:LinkButton ID="lbSearch" runat="server" CssClass="tabButton"><img src="Images/btnSearch.gif" alt="Search"/></asp:LinkButton>
                </div>
                <div class="contentContainer">
                    <div class="panelContent">
                        <asp:Panel ID="Panel1" runat="server">
                        </asp:Panel>
                    </div>
                </div>
                <div class="controlsContainer">
                </div>
            </telerik:RadAjaxPanel>
        </div>
        <telerik:RadAjaxLoadingPanel ID="LoadingPanel1" runat="server" Skin="Default">
        </telerik:RadAjaxLoadingPanel>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance