This is a migrated thread and some comments may be shown as answers.
How to Customize GlobalItemTemplate this way?
2 Answers 20 Views
This is a migrated thread and some comments may be shown as answers.
Gary
Top achievements
Rank 1
Gary asked on 08 Jun 2009, 09:32 PM
Hi,

In my project, I'd like to be able to customize the item template this way. I'll explain with the PanelBar on the page of the following link:
http://demos.telerik.com/aspnet-ajax/panelbar/examples/functionality/simple/defaultcs.aspx

For each panel item (no matter it's root item such as "Mail", or sub-item such as "Personal Folders"), I'd like to display a control (for example a label or a link button) which is on the same horizontal level as the item. So it will look something like this:

Mail                                  [29 items]
    Personal Folders         [3 items]
    Deleted Items              [6 items]
......

One more requirement: I need to bind the data dynamically in the code behind; not some pre-defined items in aspx page.

Can someone please tell me how to achieve this?

Thanks a lot!

Gary


2 Answers, 1 is accepted

Sort by
0
Accepted
Paul
Telerik team
answered on 11 Jun 2009, 02:36 PM
Hi Gary,

Please find below a sample code snippet that show the needed approach.

<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <style type="text/css">  
        div.RadPanelBar .rpItem  
        {  
            position: relative;  
        }  
    </style> 
</head> 
<body> 
    <form id="form1" runat="server">  
    <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
    <telerik:RadPanelBar ID="RadPanelBar1" runat="server">  
        <ItemTemplate> 
            <div style="position: absolute; top: 1px; left: 210px">  
                123  
            </div> 
        </ItemTemplate> 
        <Items> 
            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem1">  
                <Items> 
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1">  
                    </telerik:RadPanelItem> 
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 2">  
                    </telerik:RadPanelItem> 
                </Items> 
            </telerik:RadPanelItem> 
        </Items> 
    </telerik:RadPanelBar> 
    </form> 
</body> 
</html> 


Greetings,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Gary
Top achievements
Rank 1
answered on 15 Jun 2009, 07:44 PM
Paul,

Thank you for the post. The code snippet works well.

However, the absolute positioning makes it not align properly. Since the height of the RadPanelItem of each level is different, we cannot make all the levels align correctly. I wonder if there is any other way to do that.

Thank you.
Gary
Asked by
Gary
Top achievements
Rank 1
Answers by
Paul
Telerik team
Gary
Top achievements
Rank 1
Share this question
or