How to display a full custom component below each row while keeping standard columns visible in TelerikGrid

1 Answer 13 Views
Filter Grid GridLayout
Kenzi
Top achievements
Rank 1
Kenzi asked on 25 Jun 2025, 03:45 PM

Hello,

I’m working with the TelerikGrid for Blazor and I have a specific layout need.

I would like to display a full custom component (for example, a "MailCard" or a detail panel) under each row of the grid, while still keeping the standard grid columns (like name, date, etc.) visible as usual.

I explored the DetailTemplate, which allows me to show custom content per row, but it requires a manual click on the expand (+) button, and I haven't found any official way to auto-expand all rows by default — especially across pages.

So my two questions are:

  1. Is there a way to embed a full custom component directly within a row, without using the DetailTemplate, while still keeping the columns aligned above?

  2. If not, is there a supported method to auto-expand all rows' DetailTemplate by default, even when paging is enabled?

Thanks in advance for your help or suggestions.

Best regards,


Kenzi

1 Answer, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 26 Jun 2025, 07:07 AM

Hello Kenzi,

The DetailTemplate is the proper way to display content under the row. The other options such as column and row templates are used to set the content within the cells. 

With regard to expanding all detail rows, this can be done as demonstrated in this REPL example: https://blazorrepl.telerik.com/mTYAGqEr02oPGHzu46 

The approach involves calling the SetStateAsync method for the parent Grid in OnAfterRenderAsync, to expand its rows initially.

Regards,
Ivan Danchev
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tags
Filter Grid GridLayout
Asked by
Kenzi
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Share this question
or