Remove k-alt Class in OnRowRender

1 Answer 55 Views
Grid
Eric
Top achievements
Rank 1
Eric asked on 22 Dec 2021, 04:57 PM

I have a grid where the last few rows show different types of totals with different color highlighting. In the OnRowRenderHandler, I assign the background-color via CSS like args.Class = "bc_orange". This works fine unless the row also has the k-alt class in which case it overrides the background color.

Is there a way in the OnRowRender to remove the k-alt class? Normally in JQuery I would use the .removeClass function.

 

    public void OnRowRenderHandler(GridRowRenderEventArgs args)
    {
        Models.Results item = args.Item as Models.Results;

        switch (item.row)
        {
            case 1:
                args.Class = "bc_orange disable-hover";
                break;
                
            case 2:
                args.Class = "bc_lightgreen disable-hover";
                break;
                
            case 3:
                args.Class = "bc_lightblue disable-hover";
                break;
        }
    }


1 Answer, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 23 Dec 2021, 11:05 AM

Hello Eric,

OnRowRender can add custom classes, but does not remove built-in ones.

In this case, please use higher specificity for your CSS rule. The alt row style has specificity 0, 2, 1:

.k-grid tr.k-alt {
  background-color: rgba(0,0,0,.04);
}

For example, specificity 0, 2, 2 (or higher) will surely work:

div.k-grid tr.bc_orange {
  background-color: orange;
}

In theory, other options include:

Both require a bit more effort, but may be worth it, if you need a lot of customizations like this.

Regards,
Dimo
Progress Telerik

Learn about the important changes coming in UI for Blazor 3.0 in January 2022!
Tags
Grid
Asked by
Eric
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Share this question
or