This is a migrated thread and some comments may be shown as answers.

Panelbar Child Items

1 Answer 97 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
L
Top achievements
Rank 1
L asked on 28 Mar 2009, 04:48 AM
hi

I have a panel bar with A to Z value. They are static.

As you can see, all the Parent Item values are static A to Z.

How do i dynamically list all contacts for A from a DB  when user click on A? It should be like grouping.

 

<Items>

 

 

<telerik:RadPanelItem runat="server" Font-Bold="True" Font-Size="Larger"  Text="Back">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="A" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="B" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="C" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="D" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="E" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="F" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="G" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="H" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="I" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="J" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="K" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="L" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="M" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="N" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="O" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="P" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="Q" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="R" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="S" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="T" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="U" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="V" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="W" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="X" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="Y" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

<telerik:RadPanelItem runat="server" Text="Z" Font-Size="Large">

 

 

</telerik:RadPanelItem>

 

 

</Items>

 

1 Answer, 1 is accepted

Sort by
0
Paul
Telerik team
answered on 30 Mar 2009, 10:52 AM
Hello L,

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

ASPX:
    <form id="form1" runat="server">  
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
    </telerik:RadScriptManager> 
    <telerik:RadPanelBar ID="RadPanelBar1" runat="server" ExpandMode="SingleExpandedItem" 
        OnItemClick="RadPanelBar1_ItemClick">  
        <Items> 
            <telerik:RadPanelItem runat="server" Font-Bold="True" Font-Size="Larger" Text="Back">  
            </telerik:RadPanelItem> 
            <telerik:RadPanelItem runat="server" Text="A" Font-Size="Large">  
            </telerik:RadPanelItem> 
            <telerik:RadPanelItem runat="server" Text="B" Font-Size="Large">  
            </telerik:RadPanelItem> 
            <telerik:RadPanelItem runat="server" Text="C" Font-Size="Large">  
            </telerik:RadPanelItem> 
        </Items> 
    </telerik:RadPanelBar> 
    </form> 

Code-behind:
using System;  
using System.Collections.Generic;  
using System.Linq;  
using System.Web;  
using System.Web.UI;  
using System.Web.UI.WebControls;  
using Telerik.Web.UI;  
 
public partial class Default3 : System.Web.UI.Page  
{  
    protected void Page_Load(object sender, EventArgs e)  
    {  
 
    }  
    protected void RadPanelBar1_ItemClick(object sender, Telerik.Web.UI.RadPanelBarEventArgs e)  
    {  
        switch (e.Item.Text)  
        {  
            case "A":  
                {  
                    e.Item.Items.Clear();  
                    RadPanelItem childitem = new RadPanelItem();  
                    childitem.Value = "templateHolder";  
                    e.Item.Items.Add(childitem);  
 
                    Label lbl = new Label();  
                    lbl.Text = "This is a label for item " + e.Item.Text;  
                    childitem.Controls.Add(lbl);  
 
                    e.Item.Expanded = true;  
 
                    break;  
                }  
 
            case "B":  
                {  
                    e.Item.Items.Clear();  
                    RadPanelItem childitem = new RadPanelItem();  
                    childitem.Value = "templateHolder";  
                    e.Item.Items.Add(childitem);  
 
                    Label lbl = new Label();  
                    lbl.Text = "This is a label for item " + e.Item.Text;  
                    childitem.Controls.Add(lbl);  
 
                    e.Item.Expanded = true;  
 
                    break;  
                }  
            case "C":  
                {  
                    e.Item.Items.Clear();  
                    RadPanelItem childitem = new RadPanelItem();  
                    childitem.Value = "templateHolder";  
                    e.Item.Items.Add(childitem);  
 
                    Label lbl = new Label();  
                    lbl.Text = "This is a label for item " + e.Item.Text;  
                    childitem.Controls.Add(lbl);  
 
                    e.Item.Expanded = true;  
 
                    break;  
                }  
        }  
    }  
}  
 


Sincerely yours,
Paul
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.
Tags
PanelBar
Asked by
L
Top achievements
Rank 1
Answers by
Paul
Telerik team
Share this question
or