c# - Binding dictionary to Accordion panes -

i have accordion control several panes.

on page load want set controls inside panes data dictionary (every pane has 1 10 controls).

---

aspx

<cc1:accordion id="accordion1" runat="server"                fadetransitions="true"                selectedindex="0"                headercssclass="accordionheader"                contentcssclass="accordioncontent"                width="370px">     <panes>         <cc1:accordionpane id="accordionpane1" runat="server">             <header>                 text             </header>             <content>                               <asp:label id="lbltitle" runat="server"                            text='<%# eval("key1")%>'></asp:label></li>                          </content>         </cc1:accordionpane>              <cc1:accordionpane id="accordionpane2" runat="server">             <header>                 text             </header>             <content>                               <asp:label id="lbltitle" runat="server"                            text='<%# eval("key2")%>'></asp:label></li>                          </content>         </cc2:accordionpane>           </panes>             </cc1:accordion> 

---

c#

protected void page_load(object sender, eventargs e) {     dictionary<string, string> dic = new dictionary<string, string>();     dic.add("key1", "xxxxxxxxxx");     dic.add("key2", "yyyyyyyyyy");      accordion1.datasource = dic;     accordion1.databind(); }  

update:

this example of dictioanry want bind accordion:

 var dic = new dictionary<string, ienumerable<object>>();         dic.add("item1", new list<object>() //this pane 1                 {                      new { snumber = 12345 },                     new { color = "blue" },                     new { size = "large" },                 });         dic.add("item2", new list<object>() //this pane 2                 {                      new { snumber = 1235678 },                     new { type = "om" }                 });         accordion1.datasource = dic;         accordion1.databind();     } 

on aspx, want create pane every section (in case 2 panes), , in every pane define eval needed value.

p.s.
don't think metters if dictionary binding problem can bind else xmldocument or so...

it seem interested in binding dictionary values accordion. take advantage of data binding, should use control's templates instead of explicitly defining accordion panes. example:

<cc1:accordion id="accordion1" runat="server"                fadetransitions="true"                selectedindex="0"                headercssclass="accordionheader"                contentcssclass="accordioncontent"                width="370px">     <headertemplate>         <h2><asp:label runat="server" text='<%# eval("key") %>' /></h2>     </headertemplate>     <contenttemplate>         <div><asp:label runat="server" text='<%# eval("value") %>' /></div>     </contenttemplate> </cc1:accordion> 

---

now, if dictionary values complex objects, may true since describe having multiple controls in content, can still bind dictionary. consider slightly-more-involved dictionary below. simplicity in demonstration, dictionar values simple matching anonymous types:

protected void page_load(object sender, eventargs e) {     dictionary<string, object> dic = new dictionary<string, object>();     dic.add("key1", new { color = "red", age = 15 });     dic.add("key2", new { color = "green", age = 25 });      accordion1.datasource = dic;     accordion1.databind();  } 

you can "chase down" properties in data binding expressions accordion configured so:

<cc1:accordion id="accordion1" runat="server"                fadetransitions="true"                selectedindex="0"                headercssclass="accordionheader"                contentcssclass="accordioncontent"                width="370px">     <headertemplate>         <h2><asp:label runat="server" text='<%# eval("key") %>' /></h2>     </headertemplate>     <contenttemplate>         <div><asp:label runat="server" text='<%# eval("value.color") %>' /></div>         <div><asp:label runat="server" text='<%# eval("value.age") %>' /></div>     </contenttemplate> </cc1:accordion> 

notice important difference dot-notation in eval statements.

---

if, on other hand, dictionary value (or contains) collection of objects, small matter embed more advanced asp.net controls in content template. consider following dictionary:

var dic = new dictionary<string, ienumerable<object>>(); dic.add("key1", new list<object>()                 {                      new { color = "red" },                     new { color = "blue" }                 }); dic.add("key2", new list<object>()                 {                      new { color = "yellow" },                     new { color = "orange" }                 }); 

suppose intent present each of colors within same content area. can accomplished databinding dictionary value repeater, so:

<cc1:accordion id="accordion1" runat="server"                fadetransitions="true"                selectedindex="0"                headercssclass="accordionheader"                contentcssclass="accordioncontent"                width="370px">     <headertemplate>         <h2><asp:label id="label1" runat="server" text='<%# eval("key") %>' /></h2>     </headertemplate>     <contenttemplate>         <asp:repeater id="repeater" runat="server" datasource='<%# eval("value") %>'>             <itemtemplate>                 <div><asp:label runat="server" text='<%# eval("color") %>' /></div>             </itemtemplate>         </asp:repeater>     </contenttemplate> </cc1:accordion> 

---

happy coding!