I have a hierarchical PanelBar that uses the OnClick event handler to post back to the server. The server uses this information as parameters for a SQL query whose results will be shown on the next page. When the user clicks the actual panel bar itself (in the text area), this works fine. However, if the user clicks the Expand/Collapse arrow, the event is not triggered and no postback occurs. I noticed this same behavior in the PanelBar Server-Side Demo here: http://demos.telerik.com/aspnet-ajax/panelbar/examples/serverside/serversideevents/defaultcs.aspx
I've looked around the forums and have seen solutions that completely remove the Expand/Collapse image using CSS, but I still want the image there so the user knows if there are child items that can be viewed.
Is there a way to either catch this click on the client-side and force the event to trigger, or is there a setting that I'm missing? Or, how can I have that arrow appear while using the <ItemTemplate>?
I'm using Telerik Version: "Telerik.Web.UI, v.2011.3.1305.40"
Here's the markup (note that the items are created programatically on the server-side in Page_Load):
<div id="accountPanelBarDiv" style="float:left;width:215px">
<telerik:RadAjaxPanel ID="accountAjaxPanel" runat="server" LoadingPanelID="accountLoadingPanel">
<telerik:RadPanelBar ID="accountPanelBar" runat="server" Width="200px"
onitemclick="accountPanelBar_ItemClick" PersistStateInCookie="true"
ExpandMode="SingleExpandedItem" AllowCollapseAllItems="true"
ExpandAnimation-Duration="1000">
</telerik:RadPanelBar>
</telerik:RadAjaxPanel>
</div>