Unexpandable rows in nested grid

[Andrei Constantin]

I have two nested grids, but only certain elements from the parent grid actually have children. Long story short, I need to make the rows in the grid that have no children (so if the childInfo list is empty) be unexpandable.

<SfGrid DataSource="@parentInfo" Query="@GetParentInfo()">

     <GridTemplates>

                    <DetailTemplate>

                        @{

                            var thing = (context as Thing);

                              <SfGrid DataSource="@childInfo" Query="GetChildInfo(operatiune)">

                                   <GridColumns>

                                   <!-- several columns-->

                                   </GridColumns>

                              </SfGrid>

                         }

                         </DetailTemplate>

     <GridTemplates>

     <GridColumns> <!-- columns --> </GridColumns>

</SfGrid>

[Vignesh Natarajan]

Hi Andrei,  

 

Thanks for contacting Syncfusion support.  

 

Query: “ I need to make the rows in the grid that have no children (so if the childInfo list is empty) be unexpandable.” 

 

We have analyzed your query and we suggest you to achieve your requirement using RowDataBound event of the Grid. RowDataBound event will be trigger when row is generated. In that event, we can check for condition and add a class to row. By applying specific styles to that class name, we can disable and hide the expand icon.  

 

Refer the below code example.  

 

<SfGrid DataSource="@Employees" Height="315px"> 

    <GridEvents RowDataBound="RowDataBound" TValue="EmployeeData"></GridEvents> 

</SfGrid> 

<style> 

    /*to disbale the mouse actions*/ 

    .e-detail-disable .e-detailrowcollapse { 

        pointer-events: none; 

    } 

  

        /*if required hide the icons*/ 

        .e-detail-disable .e-detailrowcollapse .e-icon-grightarrow { 

            visibility: hidden; 

        } 

</style>  

  

@code{ 

    public void RowDataBound(RowDataBoundEventArgs<EmployeeData> Args) // will be triggered when row is created 

    { 

        if (Orders.Where(x => x.EmployeeID == Args.Data.EmployeeID).ToList().Count == 0) // check condition here whether the detail grid has records 

        { 

            Args.Row.AddClass(new string[] { "e-detail-disable" }); 

        } 

    } 

 

Kindly download the sample from below  

 

Sample:  https://www.syncfusion.com/downloads/support/forum/159775/ze/DataGrid-562047181  

 

Refer our UG documentation for your reference 

 

https://blazor.syncfusion.com/documentation/datagrid/events/#rowdatabound  

 

Please get back to us if you have further queries.  

  

Regards, 

Vignesh Natarajan