Blog Home  Home Feed your aggregator (RSS 2.0)  
Implements IVillage - Ajax Accordion Data Binding Behaviour
It takes a village to keep up with .Net
 
 Monday, December 04, 2006

I was recently using the Ajax Accordion control on a project which required me to do some databinding with it.  I was accessing more than one object to fill out the Accordion panels so I wanted to set alot of the controls during the ItemDataBound event of the control.  I quickly became frustrated as I could not find the controls in the AjaxContentPanel being made available to me in the AccordionItemEventArgs.  Here is what I was working with:

<form id="form1" runat="server">
   
<asp:ScriptManager ID="ScriptManager1" runat="server" />
      <div>
         
<cc1:Accordion ID="Accordion1" runat="server">
            
<Panes></Panes>
            
<HeaderTemplate>
               
<div style="background-color:blue;cursor:pointer;"> 
                  Header:
<!--%# Eval("Key") %-->
                  
<asp:Label ID="lblHeader" runat="server" Text="Label"></asp:Label>
               
</div>
            
</HeaderTemplate>
         
<ContentTemplate>
            
<div style="background-color:Silver;padding:5px;border:thin white inset;">
               
Data: <!--%# Eval("Value") %--> 
               
<asp:Label ID="lblData" runat="server" Text="Label"></asp:Label>
            
</div>
         
</ContentTemplate>
      
</cc1:Accordion>
   
</div>
</form>

I built a simple dictionary for this example to do the data binding.

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

   If Not IsPostBack Then

      Dim values As Dictionary(Of String, String) = New Dictionary(Of String, String)()
      values("A") = "This is the value for A"
      values("B") = "This is the value for B"
      values("C") = "This is the value for C"
      values("D") = "This is the value for D"
      Accordion1.DataSource = values
      Accordion1.DataBind()

   End If

End Sub

This is what my first attempt to set the labels in the code.

Protected Sub Accordion1_ItemDataBound(ByVal sender As Object, ByVal e As AjaxControlToolkit.AccordionItemEventArgs) Handles Accordion1.ItemDataBound

   Dim myDictEntry As KeyValuePair(Of String, String)
   Dim lblHeader As Label
   Dim lblData As Label

   myDictEntry = e.AccordionItem.DataItem
   lblHeader = e.AccordionItem.FindControl("lblHeader")
   lblHeader.Text = myDictEntry.Key
   lblData = e.AccordionItem.FindControl("lblData")
   lblData.Text = myDictEntry.Value

End Sub

I kept getting null reference exceptions on the 'lblData.Text = myDictEntry.Value' line.  I went into the locals to see what was going on with my eventArgs.  I rapidly found out that you don't want to touch e.Item*.  Any attempt to look at these caused the debugger to drop.  Not fun.  I poked around extensively in e.AccordionItem which is an AccordionContentPanel.  So it became apprent after digging around in the controls source that there are two types of ContentPanels in each AccordionItem.  There is a Content and Header panel.  And you can tell which is which by examining e.AccordionItem.ItemType. 

This is the second attempt which now workd flawlessly.

Protected Sub Accordion1_ItemDataBound(ByVal sender As Object, ByVal e As AjaxControlToolkit.AccordionItemEventArgs) Handles Accordion1.ItemDataBound

   Dim myDictEntry As KeyValuePair(Of String, String)
   Dim lblHeader As Label
   Dim lblData As Label

   myDictEntry = e.AccordionItem.DataItem
   If e.AccordionItem.ItemType = AjaxControlToolkit.AccordionItemType.Header Then
      lblHeader = e.AccordionItem.FindControl("lblHeader")
      lblHeader.Text = myDictEntry.Key
   Else
      lblData = e.AccordionItem.FindControl("lblData")
      lblData.Text = myDictEntry.Value
   End If

End Sub

I was suprised how this particular attribute was buried so deeply in the eventArgs.  I would have expected to see an e.AccordionItemType hanging out to make it a little more obvious.  Overall, I do love this control.  A nice way to present a large amount of content on a page without it running off the bottom of the screen.  And the panel sliding is just too cool.

Thursday, February 01, 2007 7:35:44 PM (Eastern Standard Time, UTC-05:00)
I strugeled for 2 days till I found this code. It works nicely , but you need to use the html control source also and the just build from there.
Tuesday, May 22, 2007 7:50:00 PM (Eastern Daylight Time, UTC-04:00)
Chris,

Thanks again for your work here. I'd love to learn how to do this. I have two questions:

1.) You mention defining a simple Dictionary to do the data binding. Do you have to implement something or inherit/import a class?

2.) For the last part, you dimension myDictEntry as KeyValuePair - but that isn't available in my intellisense. Do you know if this has changed?

Thanks - any help you can provide would be greatly appreciated!
Thursday, May 24, 2007 5:44:23 AM (Eastern Daylight Time, UTC-04:00)
Kevin:

Sorry I left those out. I import the following name spaces:

Imports System.Collections
Imports System.Collections.Generic

This should make the Dictionary and DictionaryEntry classes available to you.

Christian
Saturday, September 08, 2007 9:26:19 PM (Eastern Daylight Time, UTC-04:00)
Christian,

Thanks for putting this up. However, I am still having issues finding the labels embedded within the accordion when I hit the OnItemDataBound event. I am using C# as my language.
Friday, December 28, 2007 2:58:29 PM (Eastern Standard Time, UTC-05:00)
Hi Christian,

Thanks alot for this helpfull code. got me on the go to bind a series of nested accordions.
Tuesday, February 12, 2008 8:24:11 AM (Eastern Standard Time, UTC-05:00)
Cool, the post.

Thanks for the information.
Wednesday, May 20, 2009 9:37:20 PM (Eastern Daylight Time, UTC-04:00)
Sorry. Great Site. Useful info. I will surely check back soon. Help me! It has to find sites on the: drug and alcohol addiction treatment center. I found only this - <a href="http://design.ru-deluxe.ru/">photoshop free skachat'</a>. Important facts about alcohol treatment, medical detoxification addiction therapy as well as popular alcohol abuse treatment programs and facilities. It is often discussed in drug and alcohol addiction treatment programs and step programs. Thanks for the help :-), Brend from Seychelles.
Saturday, May 23, 2009 5:57:08 PM (Eastern Daylight Time, UTC-04:00)
How are you. You will be hearing from me soon. Thanks. Help me! Need information about: Turbo Tax. I found only this - <a href="http://turbo-tax.biz">turbo tax</a>. Drug rehab and integrated treatment options for co occurring disorders are available at la paloma treatment center in memphis, tennessee. The prometa treatment program is an innovative, outpatient medical treatment to help you recover from alcoholism. Waiting for a reply :o, Bernie from Republic.
Monday, June 01, 2009 5:38:40 PM (Eastern Daylight Time, UTC-04:00)
Good morning. I guess we'd be living in a boring, perfect world if everybody wished everybody else well.
I am from Arab and also now teach English, tell me right I wrote the following sentence: "A pioneer homeopathy website on the net offering faqs, treatment plans, anti allergic, immuno modulatory, anti inflammatory, hormone stimulatory, anti."

THX :p, Ula.
Thursday, August 13, 2009 1:34:05 PM (Eastern Daylight Time, UTC-04:00)
Interessant wie diese Informationen aussehen würden wenn aller im Gegenteil wäre?? Gewiß, sollend info, aber denke ich aus irgendeinem Grunde dass die Bemerkungen wir überhaupt nicht abgebend werden wir beitragen.
Tuesday, August 25, 2009 11:40:35 AM (Eastern Daylight Time, UTC-04:00)
Al día de hoy esto parece excesivamente entretenido, muy universal. Se puede es evidente salir bien con este motivo pero que no hables mí se alegro..
Sunday, October 04, 2009 11:07:32 PM (Eastern Daylight Time, UTC-04:00)
It is interesting very much. Though I also have not understood in all.
Friday, January 08, 2010 11:26:27 PM (Eastern Standard Time, UTC-05:00)
How can certainly bicker about this, but do not say that I admire.
Wednesday, January 13, 2010 8:41:18 PM (Eastern Standard Time, UTC-05:00)
How can I apply it...
Name
E-mail
Home page

Comment (HTML not allowed)  

Enter the code shown (prevents robots):

Copyright © 2010 Christian M Loris. All rights reserved.
DasBlog 'Portal' theme by Johnny Hughes.