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

radComboBox.ShowToggleImage = "false"

10 Answers 296 Views

ComboBox

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

10 Answers, 1 is accepted

answered on 02 May 2008, 12:08 PM

Hello Gareth,

Thank you for contacting Telerik support.

ShowToggleImage property hides the whole area designed for the toggle image, that is why you do not see borders.

To properly hide only the image you could do either of the following (depending on your specific requirements):

Put the following CSS style to the <head> section of your page (this will hide the images for all RadComboBoxes on the page):

    
                <style type="text/css"> 
            
                        .rcbArrowCell 
            
                        { 
            
                            background: none !important; 
            
                        } 
            
                    </style>

Hook to the OnClientLoad event of the RadComboBox which image you want to hide:

    
                        <telerik:RadComboBox  
            
                            ID="RadComboBox1"  
            
                            runat="server" 
            
                            OnClientLoad="HideToggleImage"> 
            
                        </telerik:RadComboBox>

and put the following JavaScript code snippet to your page:

    
                    <script type="text/javascript"> 
            
                        function HideToggleImage(sender, eventArgs) 
            
                        { 
            
                            var imageElement = sender.get_imageDomElement(); 
            
                            imageElement.parentNode.style.background = "none !important"; 
            
                        } 
            
                    </script>

I hope you will find either of the approaches useful.

Kind regards,
Simon
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

answered on 18 Oct 2016, 03:11 PM

chrome.png

ie_ff.png

This issue still exists 8 years later, though apparently it only occurs in Chrome. When you set ShowToggleImage to false, in Chrome, the combobox does not have a right hand border. This looks awful and makes the controls seem very amateurish. See attached. The top combobox has ShowToggleImage = false. The bottom one does not.

answered on 20 Oct 2016, 01:37 PM

Hello Albert,

Indeed the issue is reproducible in Chrome in 4 skins when ShowToggleImage is set to "false" and the ComboBox is in Classic render mode. Currently the development is focused on the Lightweight render mode, not just for the ComboBox but for all of the controls in the suite, thus only critical issues are fixed for Classic render mode. Having said that, there is a workaround for the missing right border:

html .RadComboBox_Metro table td.rcbInputCellLeft,

html .RadComboBox_MetroTouch table td.rcbInputCellLeft,

html .RadComboBox_Silk table td.rcbInputCellLeft,

html .RadComboBox_Simple table td.rcbInputCellLeft {

border-right-width: 1px;

}

html .RadComboBox_Metro .rcbArrowCellHidden, html .RadComboBox_Metro .rcbArrowCellHidden a,

html .RadComboBox_MetroTouch .rcbArrowCellHidden, html .RadComboBox_MetroTouch .rcbArrowCellHidden a,

html .RadComboBox_Silk .rcbArrowCellHidden, html .RadComboBox_Silk .rcbArrowCellHidden a,

html .RadComboBox_Simple .rcbArrowCellHidden, html .RadComboBox_Simple .rcbArrowCellHidden a {

border: none;

}

Regards,
Ivan Danchev
Telerik by Progress

Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.

answered on 20 Oct 2016, 06:57 PM

lightweight.png

BTW, if I set the rendermode to Lightweight for Textboxes with the Simple Skin with the following declaration:

<telerik:RadTextBox ID="txtCity" runat="Server" Width="200px" MaxLength="100" Skin="Simple" TextMode="SingleLine" Rendermode="Lightweight"></telerik:RadTextBox>

the box appears really short (see attached, the first tow are textboxes, the third is a combo). I assume this is because I would need to set a font size. What would you recommend to make the box appear to be the same height as the equivalent RadComboBox. I think these two elements ought to be the same height and have the same font appearance.

answered on 25 Oct 2016, 12:01 PM

inputWidth.zip

Hi Albert ,

The default value of render mode property is still classic, although we highly recommend to use lightweight. We have tried to simulate your scenario, but the text box is with the same width as the combobox. We have attached the tested sample. If the issue persist, please open a support ticket to be able to provide us with an isolated sample so we will be able to test it locally and can assist you in more efficient way.

Regards,
Magdalena
Telerik by Progress

Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.