Rad:Grid Change Row BackGround Color

[James]

Depending on data within row. if column "Behind90Days" is 1 then I need to make the entire row
within the datagrid some shade of red to alert the user. Have looked through too many examples
that don't seem to touch of entire row but individual columns?

In the ItemDataBound event, check the value 'Behind90Days' if it's == 1 then change entire
background color of that row to red!

Thanks!

Jim D

[-DJ-]

Hi James,

You can use the databound item and then set the item's backcolor.

Something like this should work:

Protected Sub RadGrid1_ItemDataBound(ByVal s As Object, ByVal e As GridItemEventArgs) Handles RadGrid1.ItemDataBound
    If TypeOf e.Item Is GridDataItem Then

        Dim dataItem As GridDataItem = e.Item
        Dim myCell As TableCell = dataItem("myCell")
        If myCell.Text = "Behind90Days" Then
            dataItem.BackColor = Drawing.Color.Red
            dataItem.ForeColor = Drawing.Color.White
        End If
End If
End Sub

Regards,
-DJ-

[Shinu]

Hi James,

I hope the 'Behind90Days' is the Name of the Column and you are trying to set the entire row color depending on this column value. If so you may try the following approach.

CS:

  protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
    {

        if (e.Item is GridDataItem)
        {
         GridDataItem dataItem = e.Item;
         if (dataItem[Behind90Days].Text == "1")
         {
             dataItem.BackColor = Drawing.Color.Red;
         }
     }

Thanks
Shinu

[James]

With a little of both I figured it out! If anyone see something incorrect here please let me know!
Bottom line, when databound if it finds 1 (True) in the 90DaysLate column, incorrect before as I
was using the ID rather than the UniqueName, which caused me some problems! Yech, ID should
always work I think!

protected void gridSearchResults_OnItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

GridDataItem dataItem = (GridDataItem)e.Item;

TableCell myCell = dataItem["90DaysLate"];

if ((myCell.Text == "1"))

{

//dataItem.BackColor = System.Drawing.Color.Red;

dataItem.ForeColor = System.Drawing.Color.Red;

dataItem.Font.Bold = true;

}            }     }

[-DJ-]

Hi James,

I obviously misread your post, good that Shinu stepped in.
Glad you got it working.

Regards,
-DJ-

[Shinu]

Hi James,

You may also go through the following help article which explains how to access the cell values using Column's UniqueName property.
Accessing cells and rows

Regards
Shinu.

[Ram]

Hi
In my radgrid I have set the alternativeitemstyle backcolor=white
But I'm getting some transparent line after every two rows.
How can I delete that line.

[Shinu]

Hello Ram,

Try the overriding the CSS like below.

CSS:

.RadGrid_<skinName>.rgAltRow td
{
    background-color:#FFFFFF !important;
    border-bottom-color:#FFFFFF !important;
}

Thanks,
Shinu.

[Taha]

Hi Every Body!!
i want to change position tab between cells , so it must change background cell when cell is active...

tnx

[Shinu]

Hello Taha,

I am not quite sure about your requirement. I suppose you want to change the background color of cells. Here is the sample code.
C#:

protected void grid_ItemDataBound(object sender, GridItemEventArgs e)
{
 if (e.Item is GridDataItem)
 {
  GridDataItem item = (GridDataItem)e.Item;
  TableCell cell = (TableCell)item["UniqueName"];
  cell.BackColor = System.Drawing.Color.Red;
 }
}

-Shinu.

[Paul Zillman]

I am looking to do the same type of check but on a column setup as a GridCheckBoxColumn.  How would I go about modifying the code to be able to check if the checkbox is checked or not.  Tried to do Dim myCell As CheckBox = dataItem("UniqueName") but get an error "Value of type 'System.Web.UI.WebControls.TableCell' cannot be converted to 'System.Web.UI.WebControls.Checkbox'.  Thanks.

[Shinu]

Hi,

I guess you want to access the CheckBoxColumn and assign color for the same cell checking whether it is checked or not.

C#:

protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
{
    if (e.Item is GridDataItem)
    {
        GridDataItem item = (GridDataItem)e.Item;
        CheckBox chk = (CheckBox)item["UniqueName"].Controls[0];
        if (chk.Checked)
        {
            TableCell cell = (TableCell)item["UniqueName"];
            cell.BackColor = Color.Aqua;
        }
    }
}

Thanks,
Shinu.

[Paul Zillman]

Worked perfect!  Thanks for your help.

[Vinay]

I was bind radgrid using generic list collection. 

[WebMethod]
        public static List<ServiceRequestDataClass> GetData(int startIndex, int maximumRows,
            string sortExpressions, List<GridFilterExpression> filterExpressions) 

My requirement is, I want to change row colors depends on status of column data. Status may be (Open/WIP/Acknowledge/Completed).
 When I try to implement using Itemdatabound event of radgrid. It does not giving value of status column.
 Please provide suitable solution on above problem.
 Thanks, 

[Eyup]

Hi Vinay,

If you are using client-side binding, you can make avail of the following event handler:
http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/client-side-programming/events/onrowdatabound

I hope this will prove helpful.

Regards,
Eyup
Telerik by Progress

[Vinay]

Thanks Eyup,

Your provided link is very helpful for me. I am solve my problem.

Thanks.

[Kiran]

Hi,

I am not able tos et the forecolor of the GridTemplate Column in the Item Databound.

 

 <telerik:GridTemplateColumn HeaderText="OPERATOR" UniqueName="OPERATOR" HeaderStyle-ForeColor="Wheat" AllowFiltering="false"  >                     <ItemTemplate>                             <asp:HyperLink ID="targetControl" runat="server" NavigateUrl="#" Text='<%# Eval("OPERATOR") %>'  ></asp:HyperLink>                      </ItemTemplate>                 </telerik:GridTemplateColumn>

 

 

 If strUser = "JSCAR" Then                 

       dataItem.BackColor = DarkOrange                

      dataItem.ForeColor = Black         

    End If

 

 

 

 

[Kiran]

I found the answer for my question. If anybody is trying to set the forecolor of entire but the row contains gridtemplate column. Grab the cell by doing the following:

 If strUser = "JSCAR" Then                 

dataItem.BackColor = Yellow                 

dataItem.ForeColor = Black             

 

'Gridtemplatecolumn below

  DirectCast(dataItem.Item("OPERATOR").FindControl("targetControl"), HyperLink).ForeColor = Black             

End If

[kriti]

Hi ,

I want to disable the cellbackcolor and rowbackcolor property of conditional formatting for telerik radgridview . Is there a way to do so ?

[Attila Antal]

Hi Kriti,

Can you please describe what did you mean by disabling background color? Cells are being colored manually and if there are some you do not want to apply colors for, exclude them from the conditional coloring.

It would be helpful if you could share some details about the code you are working on. We can then see what is being done and allow us to advise you accordingly.

Kind regards,
Attila Antal
Progress Telerik

[kriti]

Hi Attila,

We have created a product for our customer using Telerik dlls .

So in our code we have set the background color for cell and background color for row as some specific value (as we wanted it to be standardized). The problem is that from UI the property for cellbackcolor and rowbackcolorcolor are still visible and customer is trying to set value to it ,while it wont get reflected as i have written standardized color code for it.

So what we want now is the feasibility to disable or hide the properties from property window of conditional formatting so that customer cant see the option or play with it .

Attaching a screenshot for the fields i would like to hide or disable

[Attila Antal]

Hi Kriti,

It seems that the scenario from the screenshot is a custom implementation. Can you please show me which functionality of the Telerik UI AJAX - RadGrid allows you to change the colors the way it is shown in the screenshot? Telerik UI for ASP.NET AJAX does not share the same functionality with the GridView from the Telerik UI for WinForms suite.

Kind regards,
Attila Antal
Progress Telerik

[kriti]

Hi Attila,

 We are using telerik winforms product version 2012.1.12.0215.

The customer requirement is that we want to disable the two properties marked in the screenshot. Is it possible that we can disable  cellbackcolor and rowbackcolor property from the conditional formatting of rad grid view window in screenshot ? If not disable can i remove them .

Thanks

[Attila Antal]

Hi Kriti,

I am afraid that RadGrid from the Telerik UI for ASP.NET AJAX suite does not provide APIs to enable/disable colors the same way you would do in a WinForms project. If you want to change any of the colors you will need to use CSS as this is a Web-based application. 

In case you would like to have a UI that allows the users to change cell colors, that will need to be implemented additionally.

For Web-based applications, I would suggest inspecting the HTML elements and the styles applied to them. You can follow the suggestions in the first two points of the Improve Your Debugging Skills with Chrome DevTools blog post explaining how to inspect the generated HTML and check the applied styles for various elements. 

Once you know the styles you need to override, you can use the same style selector and add "html body " in front of it to make it more specific, "stronger". More on CSS specificity you can find here: 

• Specifics on CSS Specificity;
• CSS Specificity: Things You Should Know;
• Specificity - CSS | MSDN;

To learn more about CSS styling and using the Browser's developer tools, you may find the following videos useful: 

• How to Use the Chrome Inspector to Edit Your Website CSS - contains a Video
• Get Started With Viewing And Changing CSS
• Chrome Developer Tools Tutorial - Inspect and Test CSS 2019 - video
• Chrome DevTools for CSS - Better CSS Coding & CSS Debugging with Developer Tools - video
• Testing CSS Styles with Chrome Inspector Tool - video

Kind regards,
Attila Antal
Progress Telerik

[kriti]

Hi Attila,

Thanks for the guidance, but we have windows desktop based application.

Can you guide me for the same?

Thanks

[Attila Antal]

Hi Kiri,

I apologize, I understood that you want to achieve a Winforms like behavior with the Web-based RadGrid.

For questions related to Winforms, please open a thread in the UI for WinForms Forum discussions.

Regards,
Attila Antal
Progress Telerik

[steven schmalfeld]

I had a similar problem, in a twist on the previous solutions I am using a strongly typed object and casting the data item to that object This allows me to reference the underlying values in the data item easily using Intellihelp

    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
    {
        if (e.Item is GridDataItem)
        {
            GridDataItem dataItem = (GridDataItem)e.Item;
            Vw_People_Address vpa = (Vw_People_Address)((Telerik.Web.UI.GridItem)(dataItem)).DataItem;
            if (vpa.Undeliverable || vpa.Unverified_Notstandardized || vpa.Nosuchaddress)
            {
                e.Item.BackColor = System.Drawing.Color.Red;
                e.Item.ForeColor = System.Drawing.Color.White;
            }

        }
    }