OnRowRender in version 4 style is applied through one line.
@* Conditional styling/formatting for rows (including locked/frozen columns). *@
<style>
/*the following selectors target the locked/frozen columns*/
/*===*/
.k-grid .k-master-row.myCustomRowFormatting .k-grid-content-sticky,
.k-grid .k-master-row.myCustomRowFormatting.k-alt .k-grid-content-sticky
/*===*/
{
background-color: inherit;
}
.k-grid tr.myCustomRowFormatting:hover {
background-color: red !important;
}
.k-grid tr.myCustomRowFormatting {
background-color: #90EE90;
}
</style>
<TelerikGrid Data="@MyData"
Height="446px"
Pageable="true"
Width="450px"
OnRowRender="@OnRowRenderHandler">
<GridColumns>
<GridColumn Field="@(nameof(SampleData.Id))" Width="120px" Locked="true" />
<GridColumn Field="@(nameof(SampleData.Name))" Width="200px" Title="Employee Name" />
<GridColumn Field="@(nameof(SampleData.Team))" Width="200px" Title="Team" />
</GridColumns>
</TelerikGrid>
@code {
void OnRowRenderHandler(GridRowRenderEventArgs args)
{
var item = args.Item as SampleData;
//conditional applying Class
if (true)
{
args.Class = "myCustomRowFormatting";
}
}
public IEnumerable<SampleData> MyData = Enumerable.Range(1, 30).Select(x => new SampleData
{
Id = x,
Name = "name " + x,
Team = "team " + x % 5
});
public class SampleData
{
public int Id { get; set; }
public string Name { get; set; }
public string Team { get; set; }
}
}