This is a migrated thread and some comments may be shown as answers.

Changing row backcolor breaks hover color

3 Answers 51 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Terry Webster
Top achievements
Rank 1
Terry Webster asked on 15 Sep 2011, 03:45 PM
I have an interesting issue.  When I change the backcolor of the row in the ItemDatabound event, the hover color ends up shorter than than the actual row height.
protected void grvGrid_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
       {
           try
           {
               if (e.Item is GridDataItem)
               {
                    
                   GridDataItem item = (GridDataItem)e.Item;
                   string rowIndex = Convert.ToString(((DataTable)grvGrid.DataSource).Rows[e.Item.ItemIndex]["IDKey"]);
                   item.Attributes.Add("onclick", "itemSelected('" + rowIndex + "')");
 
                   foreach (TableCell cell in e.Item.Cells)
                   {
                       cell.ToolTip = cell.Text.Replace(" ", "").Trim();
                   }
 
                   if (e.Item.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["StatusCD"].ToString().Trim().Equals("Deleted"))
                   {
                       e.Item.BackColor = System.Drawing.Color.LightPink;
                   }
 
                   if (e.Item.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["StatusCD"].ToString().Trim().Equals("Discontinued"))
                   {
                       e.Item.BackColor = System.Drawing.Color.LightGoldenrodYellow;
                   }
 
 
               }
 
 
            
           }
           catch (Exception ex)
           {
               Session["ErrorMessage"] = ex.Message;
               Response.Redirect("ErrorPage.aspx");
           }
 
       }

When the back color gets changed for a row, the hover only covers about 80% of the height of the row.
Any ideas?

3 Answers, 1 is accepted

Sort by
0
Jayesh Goyani
Top achievements
Rank 2
answered on 15 Sep 2011, 06:01 PM
Hello,

Please set below css style.
<style>
        .RadGrid .rgHoveredRow
        {
            background-color:Red !important;
        }
    </style>

please change background-color as per your RadGrid Theme.


let me know if any concern.

Thanks,
Jayesh Goyani
0
Poulomi
Top achievements
Rank 1
answered on 10 May 2016, 09:01 AM

Hi Jayesh.

I am facing exact same issue like Terry's with my RadGrid on applying a cell color based on some condition like below :

protected void radGrid_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
       {
            if (e.Item is GridDataItem)
               {                  
                  GridDataItem item = (GridDataItem)e.Item;
                  if(item["SOME_COLUMN"].Text.Equals("SOME_TEXT"))
                    {
                      item["SOME_COLUMN"].Style["background-color"]="green";
                    }
               }
        }

I tried setting the style as you mentioned but that only changes the hover row color. The problem still persists with the new hover color. Also, I am using the Office2010Blue theme.
Please advise how to fix this.

0
Eyup
Telerik team
answered on 13 May 2016, 05:56 AM
Hi Poulomi,

There are various ways to achieve this requirement:
Copy Code
Copy Code
Copy Code
GridDataItem item = e.Item as GridDataItem;
string orgClass = e.Item.ItemIndex % 2 == 0 ? "rgRow" : "rgAltRow";
item.CssClass = orgClass + " customClassName";
CSS:
Copy Code
Copy Code
Copy Code
<style type="text/css">
    .RadGrid tr.customClassName {
        background-color: yellow;
    }
 
    div.RadGrid tr.rgSelectedRow {
        background-color: #828282;
    }
</style>

Another straightforward way to just change the font style is this:
Copy Code
Copy Code
Copy Code
Copy Code
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
{
    if (e.Item is GridDataItem)
    {
        GridDataItem item = (GridDataItem)e.Item;
        if (item.ItemIndex % 3 == 0) // custom condition
        {
            item.Font.Bold = true;
        }
    }
}

I hope this will prove helpful.


Regards,
Eyup
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
Grid
Asked by
Terry Webster
Top achievements
Rank 1
Answers by
Jayesh Goyani
Top achievements
Rank 2
Poulomi
Top achievements
Rank 1
Eyup
Telerik team
Share this question
or