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

controls within radPanelBarItem header

5 Answers 230 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
Steven Black
Top achievements
Rank 1
Steven Black asked on 07 Aug 2009, 08:36 PM
Is it possible to put controls (ie. buttons) next to the caption of a radPanelBarItem?

Thanks.

5 Answers, 1 is accepted

Sort by
0
Peter
Telerik team
answered on 10 Aug 2009, 03:13 PM
Hello Steven,

Yes, try using Templates:
http://demos.telerik.com/aspnet-ajax/panelbar/examples/functionality/templates/defaultcs.aspx



Peter
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
BIG
Top achievements
Rank 1
answered on 14 Oct 2009, 07:21 AM
This demo doesn't work on my project.
I even copied your code and still it doesn't work.

The  menu allways goes below the radpanelitem instead of inside of it. How can I get the menu inside the radpanelitem?

BIG
0
Paul
Telerik team
answered on 14 Oct 2009, 12:45 PM
Hi BIG,

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

<head runat="server">
    <title></title>
    <style type="text/css">
        div.RadPanelBar .rpItem
        {
            position: relative;
        }
        div.RadComboBox
        {
            position: absolute;
            top: 2px;
            left: 120px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>
    <telerik:RadPanelBar runat="server" ID="RadPanelBar1" Width="750px" Height="280px"
        ExpandMode="FullExpandedItem">
        <Items>
            <telerik:RadPanelItem Text="Products > Books" Expanded="true">
                <Items>
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1">
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 2">
                    </telerik:RadPanelItem>
                </Items>
                <ItemTemplate>
                    <telerik:RadComboBox runat="server" ID="RadComboBox1">
                        <Items>
                            <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem1" Value="RadComboBoxItem1" />
                            <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem2" Value="RadComboBoxItem2" />
                            <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem3" Value="RadComboBoxItem3" />
                        </Items>
                    </telerik:RadComboBox>
                </ItemTemplate>
            </telerik:RadPanelItem>
            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem2">
                <Items>
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 1">
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 2">
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 3">
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem runat="server" Text="Child RadPanelItem 4">
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelItem>
            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem3">
            </telerik:RadPanelItem>
        </Items>
    </telerik:RadPanelBar>
    </form>
</body>
</html>


Regards,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Tri Nguyen
Top achievements
Rank 1
answered on 11 May 2011, 09:01 PM
    <telerik:RadPanelItem runat="server" Text="Product">
        <HeaderTemplate>
            <div>
                <asp:CheckBox ID="CheckBox1" runat="server" Text="Meetings" />
            </div>
        </HeaderTemplate>
        <ContentTemplate>
            <div style="padding: 3px;">
                <asp:CheckBoxList ID="cklProducts" runat="server" RepeatColumns="2" RepeatDirection="Horizontal"
                    DataTextField="product_name" DataValueField="product_id">
                </asp:CheckBoxList>
            </div
        </ContentTemplate>
    </telerik:RadPanelItem>
    <telerik:RadPanelItem runat="server" Text="Profile List">
        <ContentTemplate>
            <div style="padding: 5px; padding-left: 15px;">
                <span style="padding-right: 15px; float: left;">
                    <telerik:RadComboBox ID="rcbProfileList" runat="server" Width="250px" AutoPostBack="true"
                        EnableEmbeddedSkins="True" Skin="WebBlue" Visible="true" DataTextField="profile_list_name"
                        DataValueField="profile_list_id">
                    </telerik:RadComboBox>
                </span><span style="float: left;">
                    <asp:Label ID="lblProfileListOwner" runat="server"></asp:Label></span>
            </div>
        </ContentTemplate>
    </telerik:RadPanelItem>
</Items>

Is it possible to add a control(checkbox) to the radPanelBarItem's header, with has a custom skin, and keep the same layout as the other items' header? As in the attached image, the header, which contains the checkbox, lost the text ("Product") on the left and the arrow image on the right. I also used the .css file in the C:\Telerik\RadControls for ASP.NET AJAX Q3 2010\Live Demos\PanelBar\Examples folder.

Thanks for your time.

Tri.
0
Helen
Telerik team
answered on 13 May 2011, 01:01 PM
Hello,

Actually it is not possible out of the box. When you add a template it overrides the default appearance of the PanelItems.
You should add extra control(s) to the HeaderTemplate. Please try the following:

<telerik:RadPanelBar runat="server" ID="RadPanelBar1" ExpandMode="SingleExpandedItem">
<Items>
    <telerik:RadPanelItem runat="server">
    <HeaderTemplate>
        <div>
        <span class="rpText" style="float: left">Products</span>
        <asp:CheckBox ID="CheckBox1" runat="server" Text="Meetings"/>
        <span class="rpExpandHandle"></span>
        </div>
    </HeaderTemplate>
    <ContentTemplate>
        <div style="padding: 3px;">
        <asp:CheckBoxList ID="cklProducts" runat="server" RepeatColumns="2"
            RepeatDirection="Horizontal"
            DataTextField="product_name" DataValueField="product_id">
        </asp:CheckBoxList>
        </div>
    </ContentTemplate>
    </telerik:RadPanelItem>
    <telerik:RadPanelItem runat="server" Text="Profile List">
    <ContentTemplate>
        <div style="padding: 5px; padding-left: 15px;">
        <span style="padding-right: 15px; float: left;">
            <telerik:RadComboBox ID="rcbProfileList" runat="server" Width="250px" AutoPostBack="true"
            EnableEmbeddedSkins="True" Skin="WebBlue" Visible="true" DataTextField="profile_list_name"
            DataValueField="profile_list_id">
            </telerik:RadComboBox>
        </span><span style="float: left;">
            <asp:Label ID="lblProfileListOwner" runat="server"></asp:Label></span>
        </div>
    </ContentTemplate>
    </telerik:RadPanelItem>
</Items>
</telerik:RadPanelBar>


Regards,
Helen
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Tags
PanelBar
Asked by
Steven Black
Top achievements
Rank 1
Answers by
Peter
Telerik team
BIG
Top achievements
Rank 1
Paul
Telerik team
Tri Nguyen
Top achievements
Rank 1
Helen
Telerik team
Share this question
or