Click here to Skip to main content
12,405,700 members (64,744 online)
Rate this:
 
Please Sign up or sign in to vote.
See more: C# ASP.NET Ajax
Hello all,

I want to add controls dynamically to a update panel, they are getting added but they are not getting displayed. Below is my code details.

The designer:
<asp:UpdatePanel ID="upRequirement" runat="server" UpdateMode="Always">
   <ContentTemplate>
      <asp:Button ID="btnAdd" runat="server" Text="+" CssClass="button" OnClick="btnAdd_Click" />
   </ContentTemplate>

Codebehind:
I also tried moving the code to Page_OnInit method but still no luck.
This code is inside the Page_Load method.
int count = upRequirement.ContentTemplateContainer.Controls.Count;
foreach(Requirement req in Req)
{
  Panel pnlReq = new Panel();
  pnlReq.ID = "pnl" + req.Id;
  pnlReq.Width = Unit.Percentage(100);
  pnlReq.Visible = true;
  Label lblReq = new Label();
  lblReq.ID = "lbl" + req.Id;
  lblReq.Text = req.Content;
  lblReq.Visible = true;
  Image imgReq = new Image();
  imgReq.ID = "img" + req.Id;
  CollapsiblePanelExtender pnlExtReq = new CollapsiblePanelExtender();
  pnlExtReq.ID = "pnlExt" + req.Id;
  pnlExtReq.TargetControlID = pnlReq.ID;
  pnlExtReq.CollapsedSize = 0;
  pnlExtReq.ExpandedSize = 300;
  pnlExtReq.Collapsed = true;
  pnlExtReq.AutoCollapse = false;
  pnlExtReq.AutoExpand = false;
  pnlExtReq.ScrollContents = true;
  pnlExtReq.CollapsedText = "Show details...";
  pnlExtReq.ExpandedText = "Hide details...";
  pnlExtReq.ImageControlID = imgReq.ID;
  pnlExtReq.ExpandedImage = "~/Images/Col1.jpeg";
  pnlExtReq.CollapsedImage = "~/Images/Exp1.jpeg";
  pnlExtReq.ExpandDirection = CollapsiblePanelExpandDirection.Vertical;
  pnlReq.Controls.Add(pnlExtReq);
  upRequirement.ContentTemplateContainer.Controls.Add(pnlReq);
  upRequirement.ContentTemplateContainer.Controls.Add(new LiteralControl("<br />"));
}
count = upRequirement.ContentTemplateContainer.Controls.Count;

As you can see I test the number of controls in the variable count. The count is getting increased after the loop but when the page loads controls are not visible. What is the problem can someone help me find it? Thanks in advance.
Posted 13-Feb-13 21:51pm
Updated 13-Feb-13 22:05pm
v3
Comments
richcb 14-Feb-13 10:10am
   
You are setting the Collapsed property of pnlExtReq to true, wouldn't that essentially hide all the contents in it?
rlloyd2001 14-Feb-13 18:53pm
   
Found a related link.
http://stackoverflow.com/questions/553073/adding-controls-dynamically-to-an-updatepanel-in-asp-net-ajax

1 solution

Rate this: bad
 
good
Please Sign up or sign in to vote.

Solution 1

You need to take a place holder in your update panel. Try this:
HTML:
<asp:updatepanel id="upRequirement" runat="server" updatemode="Always" xmlns:asp="#unknown">
   <contenttemplate>
      <asp:placeholder id="PlaceHolder1" runat="server">
      </asp:placeholder>
      <asp:button id="btnAdd" runat="server" text="+" cssclass="button" onclick="btnAdd_Click" />
   </contenttemplate>
   <triggers>
      <asp:asyncpostbacktrigger controlid="btnAddRequirement" />
   </triggers>
</asp:updatepanel>
Code Behind(C#) -- PreInIt Event:
int count = upRequirement.ContentTemplateContainer.Controls.Count;
foreach(Requirement req in Req)
{
  Panel pnlReq = new Panel();
  pnlReq.ID = "pnl" + req.Id;
  pnlReq.Width = Unit.Percentage(100);
  pnlReq.Visible = true;
  Label lblReq = new Label();
  lblReq.ID = "lbl" + req.Id;
  lblReq.Text = req.Content;
  lblReq.Visible = true;
  Image imgReq = new Image();
  imgReq.ID = "img" + req.Id;
  CollapsiblePanelExtender pnlExtReq = new CollapsiblePanelExtender();
  pnlExtReq.ID = "pnlExt" + req.Id;
  pnlExtReq.TargetControlID = pnlReq.ID;
  pnlExtReq.CollapsedSize = 0;
  pnlExtReq.ExpandedSize = 300;
  pnlExtReq.Collapsed = true;
  pnlExtReq.AutoCollapse = false;
  pnlExtReq.AutoExpand = false;
  pnlExtReq.ScrollContents = true;
  pnlExtReq.CollapsedText = "Show details...";
  pnlExtReq.ExpandedText = "Hide details...";
  pnlExtReq.ImageControlID = imgReq.ID;
  pnlExtReq.ExpandedImage = "~/Images/Col1.jpeg";
  pnlExtReq.CollapsedImage = "~/Images/Exp1.jpeg";
  pnlExtReq.ExpandDirection = CollapsiblePanelExpandDirection.Vertical;
  pnlReq.Controls.Add(pnlExtReq);
  upRequirement.ContentTemplateContainer.Controls.Add(pnlReq);
  upRequirement.ContentTemplateContainer.Controls.Add(new LiteralControl("
"));
  PlaceHolder1.Controls.Add(pnlReq);
  PlaceHolder1.Controls.Add(new LiteralControl("
"));
}
count = upRequirement.ContentTemplateContainer.Controls.Count;


--Amit
  Permalink  
Comments
wonder-FOOL 22-Mar-13 5:45am
   
Thanks. A bit delayed but rewarded :)

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month


Advertise | Privacy | Mobile
Web02 | 2.8.160721.1 | Last Updated 15 Feb 2013
Copyright © CodeProject, 1999-2016
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100