Change Grid Row color based on a row value

[serge]

I have the following Grid configuratrion

                    @(Html.Kendo()
        .Grid<CoucheSondageDTO>()
        .Name("CoucheSondages")
        .Columns(columns =>
        {
            columns.Bound(c => c.CoucheDescription).Width(190).ClientTemplate("<div style='background: #=CoucheCouleur#'>#=CoucheDescription#</div>"); ;
            columns.Bound(c => c.ToitTN).Width(120);
            columns.Bound(c => c.BaseTN).Width(120);
            columns.Bound(c => c.Description).Width(120);
            columns.Command(command => { command.Destroy(); }).Width(150);
        })

it gives me this:

 

Is there a way to color the ful row , or the whole cell content?

[Ivan Zhekov]

Hello, Serge.

There are three ways you can achieve your scenario:

1. To apply class on the entire row, you need to use the client side dataBind event of the grid to get the reference to the data items. Once you have reference to the item, you can add custom class name to the TR element.
   
   Тhis is common enough question as seen in a similar thread -- https://www.telerik.com/forums/conditionally-set-class-on-rows. The example from that thread still holds water to this day: http://dojo.telerik.com/aVeXi.
   
2. You can add a class name or style attribute to the cell, or any other attribute much like you do with setting width or client template, by using HtmlAttributes -- https://docs.telerik.com/aspnet-mvc/api/Kendo.Mvc.UI.Fluent/GridColumnBuilderBase#htmlattributessystemobject
3. You can even set the entire row template, though this should be reserved for very special cases in which you need complete and precise control of what gets rendered to the browser. The grid supports both client and server templates.

Each of the above has both pros and cons and it really depends on your exact scenario which is the best way. As a rule of thumb, options 1 or 2 should suffice for most cases, with 1) involving a bit of client side scripting and 2) handling everything on the server.

Regards,
Ivan Zhekov
Progress Telerik

[serge]

as you can see the color is really bound to a property of a (business) class, so are dynamic and can't be known in advance to build a css rule, the dojo defines them in css

[Tsvetomir]

Hi Sergem, you could add the row color dynamically based on a property of the data item as shown in the following updated Dojo http://dojo.telerik.com/oQAKOxat.