[Solved] Error occuring when following RadGrid SelectedRowStyle Demo

[mc2000]

Hi: I am attempting to follow the example exactly as listed on: http://demos.telerik.com/aspnet-ajax/grid/examples/styles/selectedrowstyle/defaultcs.aspx

I have a RadGrid with the default theme. For testing I changed it to Web20 to match the example exactly. I want to set the selected row style to have no background image but a background color of dark grey.

My markup looks like:

 <telerik:RadMenu runat="server" ID="NotificationRadMenu" Skin="Sitefinity"  EnableShadows="true" DefaultGroupSettings-OffsetX="-210">
            <Items>
                <telerik:RadMenuItem Visible="false" Value="label" Enabled="false"></telerik:RadMenuItem>
                <telerik:RadMenuItem Value="TemplateHeader">
                    <ItemTemplate>
                        <asp:Label ID='AlertNoticeNumber' CssClass='AlertNoticeNumber' runat="server" Text="Label" Visible="false"></asp:Label>
                    </ItemTemplate>
                    <Items>
                        <telerik:RadMenuItem CssClass="AlertMenuItem" Value="TemplateColumn">
                            <ItemTemplate>

                            <div class="AlertMenuItemContainer">
                            <Telerik:RadGrid RegisterWithScriptManager="true" ID="StudentCheckListRadGrid" AutoGenerateColumns="false" runat="server" AllowSorting="true"
                              AllowPaging="false" ShowHeader="false" PageSize="10" Width="100%" BorderWidth="0" ItemStyle-BackColor="#E8E8E8" AlternatingItemStyle-BackColor="White"
                              ClientSettings-EnableRowHoverStyle="false" OnSelectedIndexChanged="StudentCheckListRadGrid_SelectedIndexChanged"
                              ClientSettings-EnablePostBackOnRowClick="true" ClientSettings-Selecting-AllowRowSelect="true" Skin="Web20">
                                <MasterTableView AllowMultiColumnSorting="true" AutoGenerateColumns="false" ForeColor="#4B4B4B" Font-Names="Tahoma,Arial,Verdana" Font-Size="11px">
                                <Columns>
                                    <Telerik:GridBoundColumn DataField="TaskNameCheckList" HeaderText="TaskNameCheckList"></Telerik:GridBoundColumn>
                                    <Telerik:GridBoundColumn Visible="false" DataField="TaskAssociatedUserControlCheckList" HeaderText="TaskAssociatedUserControlCheckList"></Telerik:GridBoundColumn>
                                </Columns>
                                </MasterTableView>

                                </telerik:RadGrid>

I then created a Css entry

tr.SelectedRow_Web20 td
{
     background-color: red;
     background-image: none;
     padding-right: 17px;
}

The row style DOES NOT CHANGE when selected. I also noticed that when I use the <SelectedItemStyle BackColor="red" /> it works okay, but when I tried <SelectedItemStyle CssClass="RedClass" /> it does not import the styles. This method would work okay if it would allow me to remove the background image. Thanks!

[Mira]

Hello Mark,

Please use the following code to achieve the desired look:

<style type="text/css">
    .RadGrid_Web20 .rgSelectedRow
    {
        background: red !important;
    }
</style>

I hope this helps.

Regards,
Mira
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.