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

CheckBoxList Text Missing

3 Answers 124 Views

PanelBar

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

Dean Killam asked on 12 Aug 2008, 11:59 AM

Rad Controls for Ajax Q1

When using a asp.net checkboxlist control inside of a rad panel bar the text for the checkboxlist items does not appear when using some skins. Please see below example in which skin 'Hay' causes the item text not to appear. Changing the skin to web20 solves the issue but i need to use 'Hay'! Any help will be greatly appreciated

@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

@ Register Src="ProductDetails.ascx" TagName="ProductDetails" TagPrefix="uc1" %>

@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

html xmlns="http://www.w3.org/1999/xhtml">

head runat="server">

head>

body>

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<div>

</div>

<telerik:RadPanelBar runat="server" ID="RadPanelBar1" Skin="Hay" Height="300px">

<Items>

<telerik:RadPanelItem Expanded="True" Text="ASP.NET controls">

<asp:CheckBoxList ID="CheckBoxList1" runat="server" RepeatColumns="2"

RepeatDirection="Horizontal" Width="92px">

<asp:ListItem>Monday</asp:ListItem>

<asp:ListItem>Tuesday</asp:ListItem>

<asp:ListItem>Wednesday</asp:ListItem>

<asp:ListItem>Thursday</asp:ListItem>

<asp:ListItem>Friday</asp:ListItem>

<asp:ListItem></asp:ListItem>

</asp:CheckBoxList>

</ItemTemplate>

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="WinForms controls">

<Items>

<telerik:RadPanelItem Text="RadMenustrip">

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="RadTabStrip">

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="RadToolStrip">

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="Other projects">

<Items>

<telerik:RadPanelItem Text="SiteFinity">

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="Reporting">

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="RadAjax">

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelBar>

</form>

body>

html>

3 Answers, 1 is accepted

answered on 12 Aug 2008, 12:46 PM

Hello Dean,

You can easily achive your goal by setting a CSS to the CheckBoxList and specify the desired look.

    
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head runat="server">  
        
                <title></title>  
        
                <style type="text/css">  
        
                .myCheckBoxList  
        
                {     
        
                    font-family: sans-serif;  
        
                    font-style: normal;  
        
                    font-variant: normal;  
        
                    font-weight: normal;  
        
                    font-size: small;  
        
                    line-height: 100%;  
        
                    word-spacing: normal;  
        
                    letter-spacing: normal;  
        
                    text-decoration: none;  
        
                    text-transform: none;  
        
                    text-align: left;  
        
                    text-indent: 0ex;  
        
                }  
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server">  
        
                    <asp:ScriptManager ID="ScriptManager1" runat="server">  
        
                    </asp:ScriptManager> 
        
                    <telerik:RadPanelBar runat="server" ID="RadPanelBar1" Skin="Hay" Height="300px">  
        
                        <Items> 
        
                            <telerik:RadPanelItem Text="ASP.NET controls" runat="server" Expanded="True">  
        
                                <Items> 
        
                                    <telerik:RadPanelItem runat="server">  
        
                                        <ItemTemplate> 
        
                                            <asp:CheckBoxList ID="CheckBoxList1" CssClass="myCheckBoxList" runat="server" RepeatColumns="2" RepeatDirection="Horizontal" Width="92px" Height="74px">  
        
                                                <asp:ListItem>Monday</asp:ListItem> 
        
                                                <asp:ListItem>Tuesday</asp:ListItem> 
        
                                                <asp:ListItem>Wednesday</asp:ListItem> 
        
                                                <asp:ListItem>Thursday</asp:ListItem> 
        
                                                <asp:ListItem>Friday</asp:ListItem> 
        
                                            </asp:CheckBoxList> 
        
                                        </ItemTemplate> 
        
                                    </telerik:RadPanelItem> 
        
                                </Items> 
        
                            </telerik:RadPanelItem> 
        
                            <telerik:RadPanelItem Text="WinForms controls" runat="server">  
        
                                <Items> 
        
                                    <telerik:RadPanelItem Text="RadMenustrip" runat="server">  
        
                                    </telerik:RadPanelItem> 
        
                                    <telerik:RadPanelItem Text="RadTabStrip" runat="server">  
        
                                    </telerik:RadPanelItem> 
        
                                    <telerik:RadPanelItem Text="RadToolStrip" runat="server">  
        
                                    </telerik:RadPanelItem> 
        
                                </Items> 
        
                            </telerik:RadPanelItem> 
        
                            <telerik:RadPanelItem Text="Other projects" runat="server">  
        
                                <Items> 
        
                                    <telerik:RadPanelItem Text="SiteFinity" runat="server">  
        
                                    </telerik:RadPanelItem> 
        
                                    <telerik:RadPanelItem Text="Reporting" runat="server">  
        
                                    </telerik:RadPanelItem> 
        
                                    <telerik:RadPanelItem Text="RadAjax" runat="server">  
        
                                    </telerik:RadPanelItem> 
        
                                </Items> 
        
                            </telerik:RadPanelItem> 
        
                        </Items> 
        
                        <CollapseAnimation Duration="500" Type="InBounce" /> 
        
                        <ExpandAnimation Duration="500" Type="OutBounce" /> 
        
                    </telerik:RadPanelBar> 
        
                </form> 
        
            </body> 
        
            </html>

Regards,
Paul
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.