Change row hover color RowBound Event AddClass Grid

[Pavel]

Hello,

I have a row bound event to change the background color of a row but I would also like to change the hover color of that row. So I would like the hover color to also be gray Just for this row, instead of the default.

private void RowBound(RowDataBoundEventArgs<Model> arg)
{
    if (mode1)
    {
        if (arg.Data.Grey)
        {
            arg.Row.AddClass(new string[] { "grayed" });
        }
    }

}

.grayed {
    background-color: gray;
}

[Prathap Senthil]

Hi Pavel,

Greetings from Syncfusion support.

Query:” I would also like to change the hover color of that row”

We have analyzed your query and suggest you use a customized CSS class to meet your requirements. Kindly refer to the attached image and sample for your reference.

<style>

    .grayed{

        background-color:gray;

    }

   .e-grid .e-gridcontent .grayed:hover .e-rowcell{

        background-color:green !important;

   }

</style>

Please refer to the attached image. The row color was changed after hovering.

Kindly get back to us if you have any further queries.

Regards,

Prathap S

Attachment: BlazorApp1_c8a9000.zip

[Pavel]

Great that worked, thank you!

One more question,

When I click on the grey row, the color switches back to the the default white. 

Is there a way to keep the row grey even after a click on the row?

[Prathap Senthil]

Hi Pavel,

   Welcome from Syncfusion support.

Query:” When I click on the grey row, the color switches back to the default white. Is there a way to keep the row grey even after a click on the row?”
Yes, it is possible. Based on your query, we suggest you use a customizable CSS class to meet your requirements. Kindly refer to the code snippet and sample for your reference.

    /*.grayed{

        background-color:gray;

    }*/

    .e-grid .e-gridcontent .grayed .e-rowcell {

      background-color:gray;

    }

   .e-grid .e-gridcontent .grayed:hover .e-rowcell{

        background-color:green !important;

   }

If we misunderstood your requirement, kindly share more details about your requirement. it will be very helpful in providing the solution as early as possible.

Regards,

Prathap s