conditional formatting skews all the skin format once applied to a row in radgrid

3 posts, 0 answers
  1. webbdomain
    webbdomain avatar
    5 posts
    Member since:
    Jul 2007

    Posted 05 Aug 2008 Link to this post


    I have a radgrid that I've configured to use the skin Office 2007, and it looks great.  Now, I've started to configure alternate item background color, and it now returns the following in the screenshot for the alternate rows.

    (couldn't paste the screenshot image), but basically, the selected orange row is a missing section at the bottom portion where it used to be orange, but now shows the alternate row background color.

    In addition, if I start to apply conditional formatting to a row it wants to use a separate css class rather than the skin css, so for that row, I lose the format of the Office 2007 skin.  I'm doing this thru code.


    Protected Sub rgOutNAbout_ItemDataBound(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs) Handles rgOutNAbout.ItemDataBound

    'Conditional Formatting DataGrid Row

    If (TypeOf e.Item Is Telerik.Web.UI.GridDataItem) Then

    Dim dataItem As Telerik.Web.UI.GridDataItem = CType(e.Item,  Telerik.Web.UI.GridDataItem)

    If (dataItem("Returning On").Text < DateTime.Now) Then

    dataItem.CssClass =


    End If

    End If

    End Sub


    Is there a way around this? How can I find which css class the row items are using from the skin?

    Any help would be appreciated.

  2. webbdomain
    webbdomain avatar
    5 posts
    Member since:
    Jul 2007

    Posted 05 Aug 2008 Link to this post


    I just wanted to update this thread in that I was able to code the conditional formatting of the record row on a radgrid using a skin without losing the skin settings on it.

    I did so on ItemDataBind in VB.

    However, I still have the issue with the alternating style selected item style not showing properly.

    I'll play around with that some more to see if I can figure out why the alternate item style background color causes displays weird when that item row is selected. 

    Skin used is Office2007 on RadGrid with alternating item background color set.
  3. Dimo
    Dimo avatar
    8450 posts

    Posted 06 Aug 2008 Link to this post


    When declaring custom styles for RadGrid rows, (e.g. AlternatingItemStyle), you should be aware of two things:

    1) AlternatingItemStyle causes RadGrid to render an inline style in the HTML output, which takes precedence over skin styles. As a result, the declared alternating item style may override row hover and selected row styles from the skin.

    The correct approach in this case is to declare CSS classes, not styles. For example:

    <AlternatingItemStyle CssClass="MyRowClass" />

    And then use some simple CSS:

    .RadGrid_Skin  tr.MyRowClass
        background: blue ;

    In this case the custom CSS class is NOT applied on hover and on row select, so the skin styles for hovered and selected rows are preserved.

    2) Using AlternatingItemStyle or SelectedItemStyle to set a background color will NOT automatically remove any skin-defined background images for these rows. You have to remove the manually with a custom CSS rule, for example:

    .RadGrid_Skin  tr.MySelectedClass
        background: none  orange ;

    Here is a more complete example of setting custom styles for RadGrid rows:


        <SelectedItemStyle CssClass="MySelectedClass" /> 
            <AlternatingItemStyle CssClass="MyRowClass" /> 


    .RadGrid_Office2007 tr.MyRowClass 
       background:none blue
    .RadGrid_Office2007 tr.MySelectedClass 
       background:none orange

    You may also find this blog post useful:

    How To Override Styles in a RadControl for ASP.NET AJAX' Embedded Skin

    Let us know if you need more information.

    Best wishes,
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top