Datagrid row/cell borders

Radzen Blazor Studio
1

Hi,

My css is letting me down, could you please point out the css class I need to override to change the thickness of the border arround each datagrid row?

Many thanks
Reg

2

Or if it cannot be done?

3

You can try this:

<RadzenDataGrid style="--rz-grid-bottom-cell-border: 2px solid red" ...>

This will specify the bottom border of a specific RadzenDataGrid.

4

Hi @korchev,

Thanks, that has worked, but not in the way I had hoped. I'm trying to format a grid that contains composite columns so that the "parent" row separation is clearer. Having applied this styling this is the result.

image
image1613×352 22.6 KB

I would like a border that would instead work as in the following example, where I've used a highlighter to simulate it:

image
image1613×352 37.8 KB

(sorry about the poor drawing!). Alternatively, if the alternative row striping styling could be applied like this, that would be as good or better?

Cheers
Reg

5

I am not sure how this grid is configured but you can try the CellRender event and set the border through there.

6

I used the rowrender event and that's enabled me to set the background colors that alternate based on the "parent" rows (ignoring the composites) as in this screenshot:

image
image1507×166 17.6 KB

The two left-most columns are frozen, so they're picking up a different style. Can I override that style in the CellRender event somehow?

7

I am not sure as I don't know how your grid is configured. You can still try though.

8

Ok, if anyone wants to know (how to create a nicely striped datagrid where you're using composite column)...

  1. Create a simple int counter and set it to 1.
  2. Use the RowRender event to add 1 to this counter;
  3. Use the CellRender event to check if the row counter is even or not and set your desired background color as follows:

if (rownum % 2 == 0) { args.Attributes.Add("style", $"background-color: white;"); } else { args.Attributes.Add("style", $"background-color: palegreen;"); }

Cheers
Reg