gridview inside gridview in asp.net c#

Script:-


<script type="text/javascript">
        function showNestedGridView(obj) {
            var nestedGridView = document.getElementById(obj);
            var imageID = document.getElementById('image' + obj);
            
            if (nestedGridView.style.display == "none") {
            
                nestedGridView.style.display = "inline";
                imageID.src = "minus.png";
            } else {
                nestedGridView.style.display = "none";
                imageID.src = "plus.png";
            }
           
        }
       
    </script>

ASP Code:-

<asp:GridView ID="gridViewMaster" runat="server"  

            AutoGenerateColumns="False"

            CellPadding="2" DataKeyNames="Row" 

            DataSourceID="SqlDataSource1" ForeColor="Black" GridLines="None" 

            onrowdatabound="gridViewMaster_RowDataBound" RowStyle-BorderWidth="1px">

            <Columns>

            <asp:TemplateField>

                        <ItemTemplate>

                            

                                <img id="imageRow-<%# Eval("Row") %>" alt="Click to show/hide orders" border="0" src="plus.png" />

                           

                        </ItemTemplate>

                       </asp:TemplateField>

                       <asp:BoundField DataField="Row" HeaderText="Row" ReadOnly="True" ItemStyle-Width="30px"

                    SortExpression="Row" />

                <asp:BoundField DataField="DeptID" HeaderText="DeptID" ReadOnly="True" ItemStyle-Width="30px"

                    SortExpression="DeptID" />

                <asp:BoundField DataField="Department" HeaderText="Department" ItemStyle-Width="840px"

                    SortExpression="Department" />

                    <asp:TemplateField>

                    <ItemTemplate>

                      <tr>

                                <td colspan="100%">

                                   <div id="Row-<%# Eval("Row") %>" style="display:none;position:relative;left:25px;" >

                         <asp:GridView ID="nestedGridView" runat="server" AutoGenerateColumns="False" 

                          BorderWidth="1px"   DataKeyNames="EmpID" RowStyle-VerticalAlign="Bottom" OnRowDataBound="nestedGridView_RowDataBound">

                             <RowStyle VerticalAlign="Top" />

                            <Columns>

                                    <asp:BoundField DataField="EmpID" HeaderText="EmpID" InsertVisible="False" ItemStyle-Width="30px"

                                    ReadOnly="True" SortExpression="EmpID" />

                                <asp:BoundField DataField="Name of the Employee" HeaderText="Name of the Employee" ItemStyle-Width="350px"

                                    SortExpression="Name of the Employee" />

                                    <asp:BoundField DataField="DesignationName" HeaderText="DesignationName" ItemStyle-Width="300px" 

                            </Columns>

                        </asp:GridView>

                        </div>

                                </td>

                            </tr>

                    </ItemTemplate>

                </asp:TemplateField>

            </Columns>

            

        </asp:GridView>

                

        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 

            ConnectionString="<%$ ConnectionStrings:ConnectionString %>" 

            SelectCommand="select ROW_NUMBER() OVER(ORDER BY FileCode DESC) AS Row,DeptID,Department

from deptartment">

        </asp:SqlDataSource>

C# Code

protected void gridViewMaster_RowDataBound(object sender, GridViewRowEventArgs e)

        {

           

            if (e.Row.RowType == DataControlRowType.DataRow)

            {

                     e.Row.Attributes["onClick"] = "javascript:showNestedGridView('Row-" + DataBinder.Eval(e.Row.DataItem, "Row") + "');";

                string DeptID= Convert.ToString(DataBinder.Eval(e.Row.DataItem, "DeptiD"));

                GridView gridViewNested = (GridView)e.Row.FindControl("nestedGridView");

                SqlDataSource sqlDataSourceNestedGrid = new SqlDataSource();

                sqlDataSourceNestedGrid.ConnectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;

                sqlDataSourceNestedGrid.SelectCommand = "select emp.EmpID,FirstName.DesignationName from employee where deptID='" + DeptID+ "'";

                gridViewNested.DataSource = sqlDataSourceNestedGrid;

                gridViewNested.DataBind();

            }

        }