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

[Solved] Unskinned Combo Box

5 Answers 147 Views

ComboBox

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

5 Answers, 1 is accepted

answered on 20 May 2009, 01:48 PM

Hello Jerry,

Here's a sample code snippet that shows the needed approach.

    
            <telerik:RadComboBox  
        
                ID="RadComboBox1"   
        
                runat="server"   
        
                EnableEmbeddedSkins="false" 
        
                ShowToggleImage="false">  
        
            </telerik:RadComboBox>

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.

answered on 20 May 2009, 02:40 PM

Greetings Paul

thank you so much for the quick response.

My textbox now looks the way I want it to, but there are now 2 side effects
1. The design time control does not like EnableEmbeddedSkins property, but it does work

2. My auto suggest list now lists as bullets. I just want a white background with a single pixel black border.

2. There is the word "Select" to the right of my textbox. I would prefer that there was no text at all

So I was only looking to change the look of the combo box. Not the drop down or anything else that was associated with it.

thanks

answered on 21 May 2009, 01:48 PM

Hi Jerry,

Please find below a sample code snippet that shows the needed approach. Still, we do not think this is the right approach. You'd better style your drop down box.

    
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head runat="server">  
        
                <title></title>  
        
                <style type="text/css">  
        
                    .RadComboBox table  
        
                    {  
        
                        width: 100% !important;  
        
                    }  
        
                    .rcbArrowCell,  
        
                    .rcbArrowCell a  
        
                    {  
        
                        display: none !important;  
        
                    }  
        
                    .RadComboBoxDropDown  
        
                    {  
        
                        border: 1px solid #000;  
        
                    }  
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server">  
        
                <asp:ScriptManager ID="ScriptManager1" runat="server">  
        
                </asp:ScriptManager> 
        
                <telerik:RadComboBox ID="ddlgroupCategory" EnableEmbeddedBaseStylesheet="false" runat="server" 
        
                    EnableEmbeddedSkins="false" ShowToggleImage="false" Width="124px" DropDownWidth="144px">  
        
                    <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" /> 
        
                        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem4" Value="RadComboBoxItem4" /> 
        
                    </Items> 
        
                </telerik:RadComboBox> 
        
                </form> 
        
            </body> 
        
            </html>

All the best,
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.

Accepted

answered on 22 May 2009, 10:30 AM

Hi Jerry,

The look-and-feel of all Telerik controls depends on their skins. If you disable the skinning mechanism (EnableEmbeddedBaseStylesheet="false" and EnableEmbeddedSkins="false") you will get some unwanted and unexpected results (a few pixels here, a few pixels there, no borders, no hovers effects and etc.). As a consequence of that you will have to add some custom CSS style for polish the controls' visual appearance (i.e. make RadComboBox looks like the Select drop-down). So, the question is why would you do that, if you can just style the rest of the controls on your page to have consistent look with the Telerik skins used on that page(s)?

Another possible solution in this case is to make a custom skin for RadComboBox. In that way you can make your Telerik combobox look exactly as the select control.

Greetings,
Paul
the Telerik team

Instantly find answers to your questions on the newTelerik Support Portal.
Check out the tipsfor optimizing your support resource searches.