By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
432,069 Members | 1,716 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 432,069 IT Pros & Developers. It's quick & easy.

Programmatically adding ASP.net User Control to UpdatePanel

P: 5
Hi All, I got a real doozy here. I have read hundreds upon hundreds of forum posts and found numerous others who have replicated this problem, but have yet to find a solution. Through testing I have been able to find the cause of the problem, and will describe it here first textually and then through a code example.

The purpose of what I am trying to do is to create a postback-free web application through the use of ASP.net AJAX UpdatePanels and User Controls. When programmatically adding a User Control to a web page through a normal postback everything works fine. All the controls within the user control are registered properly in the page and any update panels included in the user control also work properly. HOWEVER, if instead of using a full postback you use an UpdatePanel and a partial page update of the UpdatePanel the controls do not get registered with the page and events from them do not fire (for instance, a button click event never hits the event breakpoint).

Because the very same user control works fine if loaded in a full postback or dynamically added from a namespace works fine, I can be relatively sure that it only is trouble when loading via a partial page update into an UpdatePanel. I load the control via the LoadConrol method and then add it to the page via a PlaceHolder control. Theoretically, adding the User Control to the PlaceHolder should register itself and it's controls and events with the page, but it does not.

The following code sample is a UpdatePanel-free page using a user control that works, later I will show the same code with an UpdatePanel that does not.

I think I need to figure out how to register the controls and their events with the page without going through a full page postback. Any suggestions??

This example works as expected:
Default.aspx:
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head runat="server">
  6.     <title>Untitled Page</title>
  7. </head>
  8. <body>
  9.     <form id="form1" runat="server">
  10.         <div>
  11.             <asp:PlaceHolder ID="UCPlaceHolder" runat="server"></asp:PlaceHolder>
  12.         </div>
  13.     </form>    
  14. </body>
  15. </html>
Default.aspx.cs:
Expand|Select|Wrap|Line Numbers
  1. using System;
  2. using System.Data;
  3. using System.Configuration;
  4. using System.Web;
  5. using System.Web.Security;
  6. using System.Web.UI;
  7. using System.Web.UI.WebControls;
  8. using System.Web.UI.WebControls.WebParts;
  9. using System.Web.UI.HtmlControls;
  10.  
  11. public partial class _Default : System.Web.UI.Page 
  12. {
  13.     protected void Page_Load(object sender, EventArgs e)
  14.     {
  15.         Control ctl = LoadControl("~/UserControlDemo.ascx");
  16.         ctl.ID = "UC1";
  17.         this.UCPlaceHolder.Controls.Add(ctl);
  18.     }
  19. }
UserControlDemo.ascx:
Expand|Select|Wrap|Line Numbers
  1. <%@ Control Language="C#" AutoEventWireup="true" CodeFile="UserControlDemo.ascx.cs" Inherits="UserControlDemo" %>
  2. <asp:Button ID="Button1" runat="server" Text="Display from UC" OnClick="Button1_Click" />&nbsp;<br />
  3. <br />
  4. <asp:Label ID="Content" runat="server" Text="Content"></asp:Label>
UserControlDemo.ascx.cs:
Expand|Select|Wrap|Line Numbers
  1. using System;
  2. using System.Data;
  3. using System.Configuration;
  4. using System.Collections;
  5. using System.Web;
  6. using System.Web.Security;
  7. using System.Web.UI;
  8. using System.Web.UI.WebControls;
  9. using System.Web.UI.WebControls.WebParts;
  10. using System.Web.UI.HtmlControls;
  11.  
  12. public partial class UserControlDemo : System.Web.UI.UserControl
  13. {
  14.     protected void Page_Load(object sender, EventArgs e)
  15.     {
  16.     }
  17.     protected void Button1_Click(object sender, EventArgs e)
  18.     {
  19.         Content.Text = "Content Changed.";
  20.     }
  21. }
Now, consider this variation, where instead of loading the control in the PageLoad event, you do so programmatically via a button Click event. This does not work as it cause a full postback which refreshes the placeholder. Viewstate does not seem to be working in this case. (uses the same user control as the previous example)

Default.aspx:
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head runat="server">
  6.     <title>Untitled Page</title>
  7. </head>
  8. <body>
  9.     <form id="form1" runat="server">
  10.         <div>
  11.             <asp:Button ID="Button1" runat="server" Text="Load User Control" OnClick="Button1_Click" />&nbsp;
  12.             <br />
  13.             <br />
  14.             <asp:PlaceHolder ID="UCPlaceHolder" runat="server"></asp:PlaceHolder>
  15.         </div>
  16.     </form>    
  17. </body>
  18. </html>
Default.aspx.cs:
Expand|Select|Wrap|Line Numbers
  1. using System;
  2. using System.Data;
  3. using System.Configuration;
  4. using System.Web;
  5. using System.Web.Security;
  6. using System.Web.UI;
  7. using System.Web.UI.WebControls;
  8. using System.Web.UI.WebControls.WebParts;
  9. using System.Web.UI.HtmlControls;
  10.  
  11. public partial class _Default : System.Web.UI.Page 
  12. {
  13.     protected void Page_Load(object sender, EventArgs e)
  14.     {
  15.     }
  16.     protected void Button1_Click(object sender, EventArgs e)
  17.     {
  18.         Control ctl = LoadControl("~/UserControlDemo.ascx");
  19.         ctl.ID = "UC1";
  20.         this.UCPlaceHolder.Controls.Add(ctl);
  21.     }
  22. }
To solve this postback problem, one would naturally want to use an UpdatePanel, like the following example. However this does not work as the controls do not seem to get registered with the page, and further nesting of user controls in UpdatePanels (to create a postback free app) are no better.

Default2.aspx:
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml" >
  6. <head runat="server">
  7.     <title>Untitled Page</title>
  8. </head>
  9. <body>
  10.     <form id="form1" runat="server">
  11.     <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"></asp:ScriptManager>
  12.     <div>
  13.         <asp:UpdatePanel ID="UpdatePanel2" runat="server">
  14.             <ContentTemplate>
  15.                 <asp:Button ID="Button1" runat="server" Text="Load User Control into UpdatePanel" OnClick="Button1_Click" />
  16.             </ContentTemplate>
  17.         </asp:UpdatePanel>
  18.         <br />
  19.         <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
  20.             <ContentTemplate>
  21.                 <asp:PlaceHolder ID="ContentPlaceHolder" runat="server"></asp:PlaceHolder>
  22.             </ContentTemplate>
  23.             <Triggers>
  24.                 <asp:AsyncPostBackTrigger ControlID="Button1" />
  25.             </Triggers>
  26.         </asp:UpdatePanel>
  27.     </div>
  28.     </form>
  29. </body>
  30. </html>
Default2.aspx.cs:
Expand|Select|Wrap|Line Numbers
  1. using System;
  2. using System.Data;
  3. using System.Configuration;
  4. using System.Collections;
  5. using System.Web;
  6. using System.Web.Security;
  7. using System.Web.UI;
  8. using System.Web.UI.WebControls;
  9. using System.Web.UI.WebControls.WebParts;
  10. using System.Web.UI.HtmlControls;
  11.  
  12. public partial class Default2 : System.Web.UI.Page
  13. {
  14.     protected void Page_Load(object sender, EventArgs e)
  15.     {
  16.  
  17.     }
  18.     protected void Button1_Click(object sender, EventArgs e)
  19.     {
  20.         Control ctl = LoadControl("~/UserControlDemo.ascx");  //loads into the page
  21.         ctl.ID = "UC1";
  22.         this.ContentPlaceHolder.Controls.Add(ctl); //adds to page control tree (or at least it should)
  23.     }
  24. }
I know I can use the "visible" property of my controls to toggle them on and off a page to create a flicker free experience, however, my application is a database intensive app and I don't want the page running queries against the database unless I'm absolutely sure the user wants them. Rendering a 10 forms and keeping them hidden isn't a big deal, but running 10 queries that the user never wants to see is, otherwise I'd stick to that method, its works perfectly. Any suggestions? Or requests for clarification? Any help you can provide is much appreciated...
Jun 16 '07 #1
Share this Question
Share on Google+
2 Replies


P: 1
Hello,
I'm having a simular experience to what you described. Were you able to find a solution?
Jul 29 '07 #2

P: 1
You should have the code that programatically adds controls in the Page_Init method instead of the Page_Load method. This is because viewstate is loaded between init and load..
May 25 '09 #3

Post your reply

Sign in to post your reply or Sign up for a free account.