Details on select

[Carsten Wuttke]

Hello,

how can I achieve, that the row details are expanded/collapsed on row selection?

[Saravanan Arunachalam]

Hi Carsten, 

Thanks for contacting Syncfusion’s support. 

We have achieved your requirement by using RowSelected event and expandCollapse method of Grid control. Please refer to the below code example and also refer to the below api reference link. 

<ej:Grid ID="FlatGrid" runat="server" AllowPaging="True"> 

       <ClientSideEvents RowSelected="onRowSelected" /> 

           . . . 

</ej:Grid> 

         <script type="text/javascript"> 

             function onRowSelected(args) { 

                 //Expand or collapse the detail row based on the state of detail row. 

                 var tr = $(args.row); 

                 //To expand the detail row 

                 this.expandCollapse(tr.find("td.e-detailrowcollapse")); 

                 //To collapse the detail row 

                 this.expandCollapse(tr.find("td.e-detailrowexpand")); 

             } 

         </script> 

 

https://help.syncfusion.com/api/js/ejgrid#methods:expandcollapse  

Regards, 

Saravanan A. 

[Carsten Wuttke]

Thx Saravana. Works like a charm.

[Saravanan Arunachalam]

Hi Carsten,  

Thanks for your update.            

We are happy that the provided information helped you. 

Regards, 

Saravanan A.