VJ, one of my readers, in response to another article, asked about being able to nest an Accordion Control within a Tab Container. In short, yes, it is possible:
1: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
2: <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolKit" %>
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>Microsoft ASP.NET AJAX Control ToolKit: Accordion Panels in a Tab</title>
7: </head>
8: <body>
9: <form id="form1" runat="server">
10: <asp:ScriptManager ID="ScriptManager1" runat="server" />
11: <div>
12: <ajaxToolKit:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0">
13: <ajaxToolKit:TabPanel ID="TabPanel1" runat="server" HeaderText="Content">
14: <ContentTemplate>
15: <ajaxToolKit:Accordion ID="Accordion1" runat="server">
16: <Panes>
17: <ajaxToolKit:AccordionPane ID="AccordionPane1" runat="server">
18: <Header>
19: Lorem Ipsum
20: </Header>
21: <Content>
22: <p>
23: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
24: incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
25: exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
26: irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
27: pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
28: deserunt mollit anim id est laborum.
29: </p>
30: </Content>
31: </ajaxToolKit:AccordionPane>
32: <ajaxToolKit:AccordionPane ID="AccordionPane2" runat="server">
33: <Header>
34: The Cremation of Sam McGee
35: </Header>
36: <Content>
37: <p>
38: There are strange things done in the midnight sun By the men who moil for gold;
39: The Arctic trails have their secret tales That would make your blood run cold; The
40: Northern Lights have seen queer sights, But the queerest they ever did see Was that
41: night on the marge of Lake Lebarge I cremated Sam McGee. Now Sam McGee was from
42: Tennessee, where the cotton blooms and blows. Why he left his home in the South
43: to roam ‘round the Pole, God only knows. He was always cold, but the land of gold
44: seemed to hold him like a spell; Though he’d often say in his homely way that “he’d
45: sooner live in hell.” ...
46: </p>
47: </Content>
48: </ajaxToolKit:AccordionPane>
49: </Panes>
50: </ajaxToolKit:Accordion>
51: </ContentTemplate>
52: </ajaxToolKit:TabPanel>
53: <ajaxToolKit:TabPanel ID="TabPanel2" runat="server" HeaderText="Empty">
54: <ContentTemplate>
55: <p>
56: (This tab intentionally left "blank.")
57: </p>
58: </ContentTemplate>
59: </ajaxToolKit:TabPanel>
60: </ajaxToolKit:TabContainer>
61: </div>
62: </form>
63: </body>
64: </html>
wo…great…..thank you so much..^^
Glad I could help!
Also of note, Microsoft’s ASP.NET AJAX Futures has been updated and includes some additional Silverlight-compatible features (download the Microsoft ASP.NET Futures (July 2007) Release here): http://www.joelevi.com/blog/index.php/2007/07/30/silverlight-10-rc1-released/
– http://www.JoeLevi.com
I have an Accordion within a Tab container and it works until I set the Accordion AutoSize to Fill or Limit, then my Accordion disappears. I get the same result with IE7, FireFox 2.0.0.8 and Opera 9.24. Is it possible, or at least supposed to be possible to do this? Any help would be much appeciated!
Tom