Gridviewهای تودرتو در ASP.Net

در این پست نشان خواهیم داد که چگونه Gridviewهای تو در تو را به هم متصل کرده و با آنها کار کنیم.

برا ی اینکه کار با GridViewهای تودرتو را یادبگیریم از یک مثال استفاده کرده و درآخر نتیجه را باهم خواهیم دید.

مرحله اول

ابتدا در بانک اطلاعاتی، تو جدول مانند زیر ایجاد می کنیم.

جدول اول

create table TeamLeader(  
   id int identity(1,1) Primary key,  
   Name nvarchar(30),  
   Age int,  
   Branch nvarchar(10)  
)

جدول دوم

Create  table TeamMember(  
   iid int identity(1,1) primary key,  
   TLid int CONSTRAINT FKTeamMemberPKTeamMember REFERENCES TeamLeader(id),  
   MemberName [nvarchar](50),  
   Age int,  
   Branch nvarchar(50)  
)

مرحله دوم

درون جدول ها را مانند زیر با اطلاعات پر کنید.

مرحله سوم

حالا Visual Studio را باز کرده و یک پروزه ایجاد کنید. می توانید از کدهای زیر را برای ایجاد design صفحه استفاده کنید.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Example.aspx.cs" Inherits="Example" %>  
  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title></title>  
</head>  
<body>  
    <form id="form1" runat="server">  
    <div>  
        <asp:GridView ID="GVLeader" runat="server" AutoGenerateColumns="false" AlternatingRowStyle-BackColor="lightgreen"  
            DataKeyNames="id" OnRowCommand="GVLeader_RowCommand">  
            <Columns>  
                <asp:TemplateField HeaderText="Team Leader Name">  
                    <ItemTemplate>  
                        <asp:Label ID="Label1" runat="server" Text='<%# Eval("Name") %>'></asp:Label>  
                    </ItemTemplate>  
                </asp:TemplateField>  
                <asp:TemplateField HeaderText="Age">  
                    <ItemTemplate>  
                        <asp:Label ID="Label2" runat="server" Text='<%# Eval("Age") %>'></asp:Label>  
                    </ItemTemplate>  
                </asp:TemplateField>  
                <asp:TemplateField HeaderText="Branch">  
                    <ItemTemplate>  
                        <asp:Label ID="Label3" runat="server" Text='<%# Eval("Branch") %>'></asp:Label>  
                    </ItemTemplate>  
                </asp:TemplateField>  
                <asp:TemplateField HeaderText="Team Member" ControlStyle-BackColor="#EBEBEB">  
                    <ItemTemplate>  
                        <asp:Button ID="Button1" runat="server" Text="See Member" CommandName='<%#Eval("id") %>' CommandArgument='<%#  
            Container.DataItemIndex%>' />  
                        <asp:GridView ID="GVMember" AutoGenerateColumns="false" runat="server" AutoGenerateEditButton="true"  
                            DataKeyNames="iid" OnRowCancelingEdit="GVMember_RowCancelingEdit" OnRowEditing="GVMember_RowEditing"  
                            OnRowUpdating="GVMember_RowUpdating">  
                            <Columns>  
                                <asp:TemplateField HeaderText="Name">  
                                    <ItemTemplate>  
                                        <asp:Label ID="Label4" runat="server" Text='<%#Eval("MemberName") %>'></asp:Label>  
                                    </ItemTemplate>  
                                    <EditItemTemplate>  
                                        <asp:TextBox ID="TextBox4" runat="server" Text='<%#Eval("MemberName") %>'></asp:TextBox>  
                                    </EditItemTemplate>  
                                </asp:TemplateField>  
                                <asp:TemplateField HeaderText="Age">  
                                    <ItemTemplate>  
                                        <asp:Label ID="Label5" runat="server" Text='<%#Eval("Age") %>'></asp:Label>  
                                    </ItemTemplate>  
                                    <EditItemTemplate>  
                                        <asp:TextBox ID="TextBox5" runat="server" Text='<%#Eval("Age") %>'></asp:TextBox>  
                                    </EditItemTemplate>  
                                </asp:TemplateField>  
                                <asp:TemplateField HeaderText="Branch">  
                                    <ItemTemplate>  
                                        <asp:Label ID="Label6" runat="server" Text='<%#Eval("Branch") %>'></asp:Label>  
                                    </ItemTemplate>  
                                    <EditItemTemplate>  
                                        <asp:TextBox ID="TextBox6" runat="server" Text='<%#Eval("Branch") %>'></asp:TextBox>  
                                    </EditItemTemplate>  
                                </asp:TemplateField>  
                            </Columns>  
                        </asp:GridView>  
                    </ItemTemplate>  
                </asp:TemplateField>  
            </Columns>  
        </asp:GridView>  
    </div>  
    </form>  
</body>  
</html>

designشما چیزی مانند شکل زیر خواهد بود.

در صفحه aspx.cs خود از کدهای زیر استفاده کنید.

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;

namespace NestedGridView
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["con"].ConnectionString);
        private SqlDataAdapter da;
        private DataTable dt, dt1;

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                LoadGVLeader();
            }
        }

        protected void GVLeader_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            int id = int.Parse(e.CommandName.ToString());
            int rowindex = int.Parse(e.CommandArgument.ToString());
            GridView GVMember = (GridView)GVLeader.Rows[rowindex].FindControl("GVMember");
            Button btn = ((Button)GVLeader.Rows[rowindex].FindControl("Button1"));
            if (btn.Text == "دیدن اعضا")
            {
                btn.Text = "لغو";
                GVMember.DataSource = LoadGVMember(id);
                GVMember.DataBind();
                GVMember.Visible = true;
            }
            else
            {
                btn.Text = "دیدن اعضا";
                GVMember.Visible = false;
            }

        }

        public void LoadGVLeader()
        {
            da = new SqlDataAdapter("Select * from TeamLeader", con);
            dt = new DataTable();
            da.Fill(dt);
            GVLeader.DataSource = dt;
            GVLeader.DataBind();
        }

        protected DataTable LoadGVMember(int id)
        {
            da = new SqlDataAdapter("select * from TeamMember where TLid=" + id, con);
            dt1 = new DataTable();
            da.Fill(dt1);
            return dt1;
        }

        protected void GVMember_RowEditing(object sender, GridViewEditEventArgs e)
        {
            GridView Gv = (GridView)sender;
            GridViewRow gvrow = (GridViewRow)Gv.Parent.Parent;
            int id = int.Parse(GVLeader.DataKeys[gvrow.RowIndex].Value.ToString());
            Gv.EditIndex = e.NewEditIndex;
            Gv.DataSource = LoadGVMember(id);
            Gv.DataBind();
        }

        protected void GVMember_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
        {
            GridView Gv = (GridView)sender;
            GridViewRow gvrow = (GridViewRow)Gv.Parent.Parent;
            int id = int.Parse(GVLeader.DataKeys[gvrow.RowIndex].Value.ToString());
            Gv.EditIndex = -1;
            Gv.DataSource = LoadGVMember(id);
            Gv.DataBind();
        }

        protected void GVMember_RowUpdating(object sender, GridViewUpdateEventArgs e)
        {
            GridView Gv = (GridView)sender;
            GridViewRow gvrow = (GridViewRow)Gv.Parent.Parent;
            int id = int.Parse(GVLeader.DataKeys[gvrow.RowIndex].Value.ToString());
            int iid = int.Parse(Gv.DataKeys[e.RowIndex].Value.ToString());
            string Name = ((TextBox)(Gv.Rows[e.RowIndex].FindControl("TextBox4"))).Text.Trim();
            string Age = ((TextBox)(Gv.Rows[e.RowIndex].FindControl("TextBox5"))).Text.Trim();
            string Branch = ((TextBox)(Gv.Rows[e.RowIndex].FindControl("TextBox6"))).Text.Trim();
            da =
                new SqlDataAdapter(
                    "Update TeamMember set MemberName='" + Name + "',Age='" + Age + "',Branch='" + Branch +
                    "' where iid=" + iid, con);
            dt1 = new DataTable();
            da.Fill(dt1);
            Gv.EditIndex = -1;
            Gv.DataSource = LoadGVMember(id);
            Gv.DataBind();
        }
    }
}

connection string

<configuration>
  <connectionStrings>
    <add name="con" 
      connectionString="Data Source=.; Initial Catalog=NestedGridview; Integrated Security=true;" />
  </connectionStrings>

اکنون برنامه را اجرا کنید. خروجی زیر را مشاهده خواهید کرد.