phrankbooth
Programmer
Below is a page and it's code behind. It's a simple page with an AJAX Accordion and Panes which are created on the fly.
The problem is that when I click on the pane headers, nothing happens.
Anyone have any tips on to make the panes open and close
under this scenario?
Thanks in Advance!
//CODEBEHIND:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
AccordionPane pane1 = new AccordionPane();
pane1.HeaderContainer.Controls.Add(new LiteralControl("Pane 1"));
pane1.ContentContainer.Controls.Add(new LiteralControl("Content 1"));
MyAccordion.Controls.Add(pane1);
AccordionPane pane2 = new AccordionPane();
pane2.HeaderContainer.Controls.Add(new LiteralControl("Pane 2"));
pane2.ContentContainer.Controls.Add(new LiteralControl("Content 2"));
MyAccordion.Controls.Add(pane2);
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
<script runat="server">
/// <summary>
/// Create Accordion panes on the fly
/// </summary>
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
}
</script>
<html xmlns="<head id="Head1" runat="server">
<title>Accordion Demo</title>
<style>
.accordionHeader
{
border: 1px solid #2F4F4F;
color: white;
background-color: #2E4d7B;
font-family: Arial, Sans-Serif;
font-size: 12px;
font-weight: bold;
padding: 5px;
margin-top: 5px;
cursor: pointer;
}
.accordionContent
{
background-color: #D3DEEF;
border: 1px dashed #2F4F4F;
border-top: none;
padding: 5px;
padding-top: 10px;
}
</style>
</head>
<body>
<form id="Form2" runat="server">
<asp:ScriptManager ID="Scripts" runat="server" />
<div>
<cc1:Accordion ID="MyAccordion" runat="server" RequireOpenedPane="false"
HeaderCssClass="accordionHeader" ContentCssClass="accordionContent"
FadeTransitions="true" FramesPerSecond="40" TransitionDuration="250" AutoSize="None">
</cc1:Accordion>
</div>
</form>
</body>
</html>
The problem is that when I click on the pane headers, nothing happens.
Anyone have any tips on to make the panes open and close
under this scenario?
Thanks in Advance!
//CODEBEHIND:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
AccordionPane pane1 = new AccordionPane();
pane1.HeaderContainer.Controls.Add(new LiteralControl("Pane 1"));
pane1.ContentContainer.Controls.Add(new LiteralControl("Content 1"));
MyAccordion.Controls.Add(pane1);
AccordionPane pane2 = new AccordionPane();
pane2.HeaderContainer.Controls.Add(new LiteralControl("Pane 2"));
pane2.ContentContainer.Controls.Add(new LiteralControl("Content 2"));
MyAccordion.Controls.Add(pane2);
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
<script runat="server">
/// <summary>
/// Create Accordion panes on the fly
/// </summary>
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
}
</script>
<html xmlns="<head id="Head1" runat="server">
<title>Accordion Demo</title>
<style>
.accordionHeader
{
border: 1px solid #2F4F4F;
color: white;
background-color: #2E4d7B;
font-family: Arial, Sans-Serif;
font-size: 12px;
font-weight: bold;
padding: 5px;
margin-top: 5px;
cursor: pointer;
}
.accordionContent
{
background-color: #D3DEEF;
border: 1px dashed #2F4F4F;
border-top: none;
padding: 5px;
padding-top: 10px;
}
</style>
</head>
<body>
<form id="Form2" runat="server">
<asp:ScriptManager ID="Scripts" runat="server" />
<div>
<cc1:Accordion ID="MyAccordion" runat="server" RequireOpenedPane="false"
HeaderCssClass="accordionHeader" ContentCssClass="accordionContent"
FadeTransitions="true" FramesPerSecond="40" TransitionDuration="250" AutoSize="None">
</cc1:Accordion>
</div>
</form>
</body>
</html>