Collapsable expander in dynamic way

You need to take a place holder in your update panel. Try this:
HTML:

 Collapse | Copy Code

<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:

 Collapse | Copy Code

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;

protected void Page_Load(object sender, EventArgs e)

    {        

        // Create Header Panel

        Panel panelHead = new Panel();

        panelHead.ID = "pH";

        panelHead.CssClass = "cpHeader";

        // Add Label inside header panel to display text

        Label lblHead = new Label();

        lblHead.ID = "lblHeader";

        panelHead.Controls.Add(lblHead);

 

        //Create Body Panel

        Panel panelBody = new Panel();

        panelBody.ID = "pB";

        panelBody.CssClass = "cpBody";

        // Add Label inside body Panel to display text

        Label lblB = new Label();

        lblB.ID = "lblBody";

        lblB.Text = "This panel was added dynamically";

        panelBody.Controls.Add(lblB);

 

        // Create CollapsiblePanelExtender

        CollapsiblePanelExtender cpe =

            new CollapsiblePanelExtender();

        cpe.TargetControlID = panelBody.ID;

        cpe.ExpandControlID = panelHead.ID;

        cpe.CollapseControlID = panelHead.ID;

        cpe.ScrollContents = false;

        cpe.Collapsed = true;

        cpe.ExpandDirection =

        CollapsiblePanelExpandDirection.Vertical;

        cpe.SuppressPostBack = true;

        cpe.TextLabelID = lblHead.ID;

        cpe.CollapsedText = "Click to Show Content..";

        cpe.ExpandedText = "Click to Hide Content..";

 

        this.UpdatePanel1.ContentTemplateContainer.Controls.Add(panelHead);

        this.UpdatePanel1.ContentTemplateContainer.Controls.Add(panelBody);

        this.UpdatePanel1.ContentTemplateContainer.Controls.Add(cpe);

 

    }