ComboBox Scrollbar

9 posts, 0 answers
  1. Alan
    Alan avatar
    16 posts
    Member since:
    May 2005

    Posted 06 Nov 2008 Link to this post

    Hello

        I am using the  ASP.Net AJAX controls version 2008.2.1001.20

       I have problem usign the combobox ,Scroll bar for the dropdown of the comboBox is not as the same in the browser scrollbar, for all the skins it shows the scroll bar in gray color.

    Earliest reply is appreciated

     Thank you



  2. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 06 Nov 2008 Link to this post

    Hi Mark Leeds,

    In Internet Explorer we have styled the scrollbar to look more consistent with the appearance of RadComboBox. If you want to disable it you should edit the CSS file used by your skin and remove this CSS rule:

    .RadComboBoxDropDown_<SkinName> .rcbScroll
    {
        scrollbar-face-color: #e9e9e9;
        scrollbar-highlight-color: #ffffff;
        scrollbar-shadow-color: #e9e9e9;
        scrollbar-3dlight-color: #dbdbdb;
        scrollbar-arrow-color: #787878;
        scrollbar-track-color: #f5f5f5;
        scrollbar-darkshadow-color: #aeaeae;
    }

    This help topic demonstrates how to customize an existing skin.

    Regards,
    Albert
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Jose
    Jose avatar
    49 posts
    Member since:
    Aug 2008

    Posted 06 Nov 2008 Link to this post

    Hi Mark.

    I would check two things:

    1. Check if you are using an embeded skin. If you are, make sure your combobox is set to EnableEmbeddedSkins="true". If you are not using embeded skins, then EnableEmbeddedSkins should be "false" and verify that you're CSS file handles the scrollbar (as the sample by Albert).
    2. If you are using a RadFormDecorator, make sure comboboxes are in the list of selected controls to be decorated.

    Hope this could help.

    Jose Guay

  5. Alan
    Alan avatar
    16 posts
    Member since:
    May 2005

    Posted 07 Nov 2008 Link to this post

    Hi Albert

     Thanks for your reply.
     I have removed the css rule in the css file as you mentioned .

     I included the css file as in the below line in my page.

    <link href="../RadControls/Combobox/Skins/WebBlue/ComboBox.WebBlue.css" rel="stylesheet" type="text/css" />

     I have used the follwoing code for declaring the comboBox

    <telerik:RadComboBox ID="DateRangeNextRadCombo" runat="server" Skin="WebBlue" AutoPostBack="true" EnableEmbeddedSkins="false
      OnClientSelectedIndexChanging="DateSelectedIndexChange" Width="140px" OnSelectedIndexChanged="IndexChanged"  Font-Size="11px" Height="200px">

     
    I still face the same problem (Scroll bar for the dropdown of the comboBox is not as the same in the browser scrollbar, for all the skins it shows the scroll bar in gray color)

      Regards
      Mark.

  6. Jose
    Jose avatar
    49 posts
    Member since:
    Aug 2008

    Posted 07 Nov 2008 Link to this post

    I see in you radcombo declaration that the parameter EnabledEmbededSkins is missing a closing quote.

  7. Alan
    Alan avatar
    16 posts
    Member since:
    May 2005

    Posted 11 Nov 2008 Link to this post

    Hi,

      Still I am facing the same problem after having the quotes closed in the declaration.

    Thank you
  8. Simon
    Admin
    Simon avatar
    2281 posts

    Posted 11 Nov 2008 Link to this post

    Hello Mark Leeds,

    Is it possible that you have some additional CSS used in your page, that might be defining the scrollbar appearance as well? Can you verify that?

    Additionally, it will probably help if you can provide a screenshot of the scrollbar's odd appearance.

    Thank you in advance.

    Greetings,
    Simon
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  9. Clive Hoggar
    Clive Hoggar avatar
    334 posts
    Member since:
    Nov 2008

    Posted 10 Jul 2009 Link to this post

    Hi

    I think my problem is related to this discussion but I am not sure about the solution...

    The website master page has a form decorator with Black skin, but there are certain
    pages on which the default skin renders some elements better due to the page background,
    so I have explicitly set the skin for those elements separately.

    A combo box with skin explicitly set to default renders with grey scrollbar in Firefox (as I intended)
    but in IE7 it renders them black.

    I still want the overall page to use the black skin, although it would not be  disaster if the main scrollbars,
    were grey if this is the only possibility to get consistency.

    What do you suggest?

    thanks

    Clive
  10. Simon
    Admin
    Simon avatar
    2281 posts

    Posted 13 Jul 2009 Link to this post

    Hello Clive Hoggar,

    RadFormDecorator stylizes the scrollbars on the page and since RadComboBox does not do so, its scrollbars inherit the styles of the Decorator.

    You could avoid this by explicitly specifying the Decorated Zone of the RFD to be an element in the <form> element. This will resolve the issue because the drop down is detached when opened and the scrollbar styles will not be applied.

    Below is a sample code:

    <form id="form1" runat="server"
        <asp:ScriptManager ID="ScriptManager1" runat="server"
        </asp:ScriptManager> 
        <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" Skin="Black" DecorationZoneID="formContainer" /> 
        <div id="formContainer"
            <telerik:RadComboBox ID="RadComboBox1" runat="server" Height="50px" Skin="Default"
                <Items> 
                    <telerik:RadComboBoxItem runat="server" Text="1" /> 
                    <telerik:RadComboBoxItem runat="server" Text="2" /> 
                    <telerik:RadComboBoxItem runat="server" Text="3" /> 
                    <telerik:RadComboBoxItem runat="server" Text="4" /> 
                    <telerik:RadComboBoxItem runat="server" Text="5" /> 
                </Items> 
            </telerik:RadComboBox> 
        </div> 
    </form> 

    Please let me know if you need further guidance with this.

    Regards,
    Simon
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017