How do I add a CSS class to a row in a TelerikGrid

Question

I need to apply a class to each row where the related "TransactionsRO" record's ColorControl = 'F'. I have tried using an @if statement in the HTML (see below), but I can't figure out how to define "rowRecord." I also tried a button with the "Test()" method, but I need help with the "Code goes here" line.

   <TelerikGrid  Data="@GridDataSource"
                 EditMode="@Telerik.Blazor.GridEditMode.Incell"
                 @ref="Grid"
                 SelectionMode="Telerik.Blazor.GridSelectionMode.Multiple"
                 @*...*@>
     <GridToolBar>
        <TelerikButton OnClick="@Test()">Click me</TelerikButton>
    </GridToolBar>
        <GridColumns>
             <GridColumn Field="@nameof(TransactionsRO.ColorControl)" Width="50px"></GridColumn>
             @*@if("rowRecord" == 'F')
                 {
                     class = myCssClass
                 }*@
             <GridCheckboxColumn CheckBoxOnlySelection="true" 
                                 Width="50px" />
        </GridColumns>
    </TelerikGrid>


@code {
    [Parameter]
    public TransactionsCollection GridDataSource { get; set; }

    public TelerikGrid<TransactionsRO> Grid;

    public EventCallback Test(){
        List <TransactionsRO> gridRows = Grid.Data.ToList();
        List<int> fRows = new List<int>();
        foreach (TransactionsRO row in gridRows)
        {
            if(row.ColorControl == 'F'.ToString()){
                int rowNum = gridRows.IndexOf(row);
                fRows.Add(rowNum);
            }
        }

        foreach(TransactionsRO row in Grid){
            //Code goes here
        }
        EventCallback placeHolder;
        return placeHolder;
    }
}

Answer 1

Use the rowrender and cellrender events (at the grid and column level respectively)