Adding a link button to a root panel item

[richardFlow]

I'm trying to use a panel bar to create a similar menu to this:

http://www.asos.com/Men/Jeans/Cat/pgecategory.aspx?cid=4208#parentID=Rf-100&pge=0&pgeSize=20&sort=-1&state=Rf-100%3DJeans

I've managed to create the basic functionality, but cannot add a 'clear' button to the root panel item whenever a selection is made. How would I go about doing this? I have included an example panel item below. In this example I would need to be able to add it in the cblStyle_IndexChanged code:

<telerik:RadPanelItem Text="Style" Expanded="true">

 <Items>

  <telerik:RadPanelItem>

   <ItemTemplate>

    <asp:CheckBoxList ID="cblStyle" runat="server" AutoPostBack="true" OnSelectedIndexChanged="cblStyle_IndexChanged">

    </asp:CheckBoxList>

   </ItemTemplate>

  </telerik:RadPanelItem>

 </Items>

</telerik:RadPanelItem>

Regards,

Richard

[Poul Henningsen]

that's a bit tricky. you can check this demo - http://demos.telerik.com/aspnet-ajax/panelbar/examples/functionality/templates/defaultcs.aspx. in general, the idea is to set absolute position to the templated element, i.e.

/* styling and positioning of RadMenu template */

div.RadPanelBar .rpItem
{
    position: static;
    overflow: visible;
}

div.RadPanelBar .rpTemplate
{
    position: absolute;
    z-index: 1;
}

div.RadPanelBar .rpSlide .rpTemplate
{
    position: static;
    z-index: auto;
}

div.RadMenu
{
    position: absolute;
    top: -24px;
    left: 120px;
}

div.RadMenu .rmRootGroup
{
    border: 0;
    background: none;
}

div.RadMenu .rmItem
{
    background: none;
}

div.RadMenu .rootItem,
div.RadMenu .rootItem .rmText
{
    background: none !important;
    border: 0;
    padding: 0 !important;
    color: #4fb50b;
    line-height: 20px;
    text-decoration: none;
}