Hierarchy grid background color of the expanded row

Radzen.Blazor Components
1

Hi,
I would like to set the same background color of the expanded content and the row itself.
I noticed that the <tr> tag of the content has class rz-expanded-row-content and is inserted right below the <tr> of the row that has simply class rz-datatable-even or rz-datatable-odd so I cannot figure out a way to tweak this behavior.

image
image845×374 15.2 KB

Can you please give me some advice how could I obtain this?

Best regards,
Ivan

2

You can use RowExpand event to catch expanded item(s) and use later RowRender event to set conditionally style/class depending on saved item(s) in RoeExpand.

3

Hi!
Thank you for your quick(as always) reply!

I followed your advice and it worked.

So here is my example for further reference.

RadzenDataGrid definition:

<RadzenDataGrid Data="@ControlDefinitions" @ref="controlsGrid" TItem="ControlDefinitionModel"
                    ...
                    RowExpand="@OnControlsRowExpand"
                    RowCollapse="@OnControlsRowCollapse"
                    RowRender="@OnControlsRowRender">
...
...

</RadzenDataGrid>

in the code:

@code {
    private List<ControlDefinitionModel> ExpandedControls { get; } = new();

...
...
...

    private void OnControlsRowRender(RowRenderEventArgs<ControlDefinitionModel> args)
    {
        if (ExpandedControls.Contains(args.Data))
        {
            args.Attributes.Add("class", "link-expanded-row");
        }
    }

    private void OnControlsRowExpand(ControlDefinitionModel control)
    {
        ExpandedControls.Add(control);
    }

    private void OnControlsRowCollapse(ControlDefinitionModel control)
    {
        ExpandedControls.Remove(control);
    }
}

css class definition:

.link-expanded-row {
    background-color: #c0ddec;
    ...
    ...
}

So, essentially on Expand/Collapse I update a list of expanded items and then on render I attach a class if the row is expanded.
I guess that with a lot of rows and with ExpandMode DataGridExpandMode.Multiple my solution may be not performant enough, but I'm using DataGridExpandMode.Single so it should be enough.

Best regards,
Ivan