RadGrid Change row background color

[Srinivas Nilagiri]

Hi, 
In each row of my RadGrid I have a CheckBox as shown below.

<telerik:GridTemplateColumn HeaderText="Is Critical?" HeaderButtonType="TextButton" UniqueName="critical">
    <ItemTemplate>
        <asp:CheckBox ID="chkCritical" runat="server" />
    </ItemTemplate>
</telerik:GridTemplateColumn>

When the user checks the CheckBox system makes an ajax call from clientside and updates the database. This part is working fine.
I want change the row background color on check/uncheck of the CheckBox on clientside. Could not find a method to set background color on DataItem. Please help.

[Pavlina]

Hi Srinivas,

To achieve your goal you can check if the CheckBox is check/uncheck and depending on this you can set different style for the whole row using this code:

eventArgs.get_gridDataItem().get_element().style.backgroundColor = "red";

Greetings,
Pavlina
the Telerik team

[Srinivas Nilagiri]

Thanks Pavlina for the reply. This is working when I don't set a CssClass for the row. On serverside ItemDataBound I am setting CssClass like this if the item is critical.

if (e.Item.ItemType == GridItemType.Item)
{
    item.CssClass = "rgRow critical";
}
else
{
   item.CssClass = "rgAltRow critical";
}

When I assign backgroundColor as suggested it doesn't change. I tried eventArgs.get_gridDataItem().get_element().CssClass = "rgRow" but not working too. Not sure whether this is right way of doing, the following code works.

if (chk.checked) {
     $(dataitem.get_element()).addClass('criticalspare') ;
} else {
    $(dataitem.get_element()).removeClass('criticalspare');
}

[Pavlina]

Hi Srinivas,

You can check the forum thread below and see if it helps:
http://www.telerik.com/community/forums/aspnet-ajax/grid/change-row-color-based-on-two-template-check-boxes.aspx

Best wishes,
Pavlina
the Telerik team