Nest Detail Records in Master Record Row?

Greetings everyone! First off I love Radzen, I don't know what I would do without it!

My question is this... In trying to meet a user request I stumbled upon this forum post where the exact thing I want appears to have been implemented. Does anyone know how to achieve a similar effect in Blazor using Radzen?

Display Detail Records In-Line on Master Rows W/Datagrid?
For every master record, I want to be able to display each detail within the same row as pictured in the screenshot I have linked to. Can someone help or point me to a better resource?

SCREENSHOT

FORM POST

You can use Template property of the DataGrid similar to pages created with our Master/Detail Hierarchy wizard. Or you are looking for TreeGrid? TreeGrid like structure is not supported at the moment.

Vladimir, thank you for your prompt response. I am definitely trying to use the data grid. I will experiment with your suggestion today and respond again in this thread if I am still having problems!

Vladimir, I have tried your suggestion and am still having no luck :frowning:

I would like to match this scenario

The data class I have for my master table includes a defintion of the detail table, it looks like this
public virtual ICollection<TblDetail> TblDetail { get; set; }

Within the datagrid, I would like to call something like

        @* THIS IS WHERE I NEED HELP *@
        <RadzenGridColumn TItem="TblMaster"
                          Property="TblDetail.detail_column"
                          Title="detail_column">
        </RadzenGridColumn>

Apologies for all the questions. I really appreciate your assistance on this. Is what I am asking for supported by Radzen Blazor?

If you want to have detail grid in the master grid column template you can do:

 <RadzenGrid AllowFiltering="true" AllowPaging="true" PageSize="3" AllowSorting="true"
                Data="@orders" TItem="Order">
        <Columns>
            <RadzenGridColumn Width="100px" TItem="Order" Property="OrderID" Title="Order ID" />
            <RadzenGridColumn Width="200px" TItem="Order" Property="Customer.CompanyName" Title="Customer" />
            <RadzenGridColumn TItem="Order" Title="Details">
                <Template Context="order">
                    <RadzenGrid AllowFiltering="true" AllowPaging="true" AllowSorting="true" Data="@order.OrderDetails" TItem="OrderDetail">
                        <Columns>
                            <RadzenGridColumn TItem="OrderDetail" Property="Order.CustomerID" Title="Order" />
                            <RadzenGridColumn TItem="OrderDetail" Property="Product.ProductName" Title="Product" />
                            <RadzenGridColumn TItem="OrderDetail" Property="UnitPrice" Title="Unit Price">
                                <Template Context="detail">
                                    @String.Format(new System.Globalization.CultureInfo("en-US"), "{0:C}", detail.UnitPrice)
                                </Template>
                            </RadzenGridColumn>
                            <RadzenGridColumn TItem="OrderDetail" Property="Quantity" Title="Quantity" />
                            <RadzenGridColumn TItem="OrderDetail" Property="Discount" Title="Discount">
                                <Template Context="detail">
                                    @String.Format("{0}%", detail.Discount * 100)
                                </Template>
                            </RadzenGridColumn>
                        </Columns>
                    </RadzenGrid>
                </Template>
            </RadzenGridColumn>
        </Columns>
    </RadzenGrid>
...
@code {
    IEnumerable<Order> orders;

    protected override void OnInitialized()
    {
        orders = dbContext.Orders.Include("Customer").Include("Employee").Include("OrderDetails").Include("OrderDetails.Product").ToList();
    }
}

Something went wrong..

  1. Get parent and child data:
  2. Bind data to master grid:
  3. Add new column to master grid and set it's template:
  4. Add child datagrid to template, set data souce to child data and try to add some column to child datagrid:
  5. Edit child datagrid columns:
  6. Crash!

Can you check the log file what's the error?

[2020-04-02 13:17:02.549] [error] TypeError: Cannot read property 'properties' of undefined
at resolveSchema (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:9:73918)
at su.render (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:290:3112394)
at ki (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:63001)
at Ci (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:62796)
at Ti (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:66630)
at Vo (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:90674)
at Wo (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:91058)
at vs (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:97945)
at Cs (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:97325)
at Qs (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:98700)
at In (file:///Applications/Radzen.app/Contents/Resources/app.asar/static/renderer.js:189:30568)

Thanks! I was able to reproduce it locally - we will do our best to release fix with our next update (early next week). In the meantime you can add the detail grid as template string: