radgrid filter dropdown

5 posts, 0 answers
  1. MBEN
    MBEN avatar
    220 posts
    Member since:
    Nov 2011

    Posted 07 May 2018 Link to this post

    I have a filter column in my radgrid. Recently, I upgraded my telerik controls and the filter dropdown looks weird with a select word in it.

    How can I remove the select word and show just the dropdown arrow.

    Below is the rendered css from the developer tools:

    <a id="ctl00_ctl00_MainContentPlaceHolderContent_ContentPlaceHolder1_rgDocumentManagement_ctl00_ctl02_ctl03_RadComboBoxPlanFilter_Arrow" style="overflow: hidden; display: block; position: relative;">select</a>
  2. MBEN
    MBEN avatar
    220 posts
    Member since:
    Nov 2011

    Posted 07 May 2018 in reply to MBEN Link to this post

    I forgot to specify the custom css I have in my project for the combobox:

    .RadComboBox .rcbArrowCell {
        background-image: url('ComboBox/down_arrow.png');
        padding: 0 5px;
        background-repeat: no-repeat;
        background-position: center 5px;
        background-color: #e4e7ed;
        width: 32px;
        cursor: pointer;
    }
     
        .RadComboBox .rcbArrowCell a {
            text-indent: -999px;
            width: 22px;
            overflow: hidden;
            height: 22px;
        }
  3. Vessy
    Admin
    Vessy avatar
    2277 posts

    Posted 10 May 2018 Link to this post

    Hello,

    The default render mode in the latest version of the controls is Lightweight, while the provided custom CSS targets the classic layout of the controls. Forcing the Classic render mode in a similar way should bring back the behavior prior to the upgrade:
    web.config

    <
    appSettings>
        <add key="Telerik.Web.UI.RenderMode" value="classic" />
    </appSettings>



    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  4. MBEN
    MBEN avatar
    220 posts
    Member since:
    Nov 2011

    Posted 10 May 2018 in reply to Vessy Link to this post

    Unfortunately, that didn't resolve the issue. I have submitted a support ticket.
  5. Vessy
    Admin
    Vessy avatar
    2277 posts

    Posted 11 May 2018 Link to this post

    Hi,

    I have just answered your support ticket on the matter, for convenience I will paste my answer here as well:

    After a further investigation the problem turned out to be related to a "text-align:right" style, added to the filter row of the Grid in our latest versions. You can overwrite this behavior for the ComboBox inside this row in a similar way:
    .RadGrid tr.rgFilterRow .RadComboBox {
        text-align: center;
    }


    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top