Thursday, July 16, 2009

The TargetControlID of '_AccordionExtender' is not valid. The value cannot be null or empty.

Once I was working with a Ajax Based Project in .NET. I was using Accordian Pane. My code was like this (Please note this is just a sample code only for readers):

<ajaxToolkit:Accordion runat="server" TransitionDuration="240" FadeTransitions="true" FramesPerSecond="40" SelectedIndex="0" >
<Panes>
<ajaxToolkit:AccordionPane ID="hd1" runat="server">
<Header>
<a href="" onclick="return false" >HEADER 1</a>
</Header>
<Content>
CONTENT OF HEADER 1
</Content>
</ajaxToolkit:AccordionPane>


<ajaxToolkit:AccordionPane ID="hd2" runat="server">
<Header>
<a href="" onclick="return false" >HEADER 2</a>
</Header>
<Content>
CONTENT OF HEADER 2
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>

And I was facing an Error saying

"The TargetControlID of '_AccordionExtender' is not valid. The value cannot be null or empty."

After digging a little bit I found that I have not provided ID to Accordian

<ajaxToolkit:Accordion id="accordian1" runat="server" TransitionDuration="240" FadeTransitions="true" FramesPerSecond="40" SelectedIndex="0" >
<Panes>
<ajaxToolkit:AccordionPane ID="hd1" runat="server">
<Header>
<a href="" onclick="return false" >HEADER 1</a>
</Header>
<Content>
CONTENT OF HEADER 1
</Content>
</ajaxToolkit:AccordionPane>


<ajaxToolkit:AccordionPane ID="hd2" runat="server">
<Header>
<a href="" onclick="return false" >HEADER 2</a>
</Header>
<Content>
CONTENT OF HEADER 2
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>

After providing ID to Accordian its works fine..................

I hope that this post will also help you.

No comments: