Click here to Skip to main content
15,891,184 members
Please Sign up or sign in to vote.
3.00/5 (2 votes)
See more:
hello friends i want show grid within grid to show the information of perticular column on click it has to show another grid please reply
Posted

Hi ,
Try this Example will Guide you .
XML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 <script type="text/javascript">
     function SwitchImages(obj) {
         var div = document.getElementById(obj);
         var img = document.getElementById('img' + obj);

         if (div.style.display == "none") {
             div.style.display = "inline";
             img.src = "images/minus.png";
         } else {
             div.style.display = "none";
             img.src = "images/plus.png";
         }
     }
 </script>
 <style type="text/css">
 .GDiv
{
    display:none;
    position:relative;
    font-size:16px;
    color:#434343;
    width:100%;
    font-weight:bold;
    border:1px solid #ccc;
    min-height:30px;

}

 </style>
</head>
<body >
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
            CellPadding="4" ForeColor="#333333" GridLines="None"
            onrowdatabound="GridView1_RowDataBound">
            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
            <Columns>
                <asp:TemplateField HeaderText="Order ID">
                    <ItemTemplate>
                        <asp:Label ID="lblID" runat="server" Text="<%# Bind('orderID') %>"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="order amount">
                    <ItemTemplate>
                        <asp:Label ID="lblAmount" runat="server" Text="<%# Bind('OrderAmount') %>"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="date ">
                    <ItemTemplate>
                        <asp:Label ID="lblDate" runat="server" Text="<%# Bind('date') %>"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField>
                    <ItemTemplate>

                              <a href="javascript:SwitchImages('div<%# Eval("orderID")%>');">
                            <img id="imgdiv<%# Eval("orderID")%>" alt="" border="0" src="images/plus.png" />
                        </a>
                      </td></tr>
                        <tr>
                            <td colspan="100%">
                                <div id="div<%# Eval("orderID") %>" class="GDiv">

                                                 <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" Width="95%">
                                <Columns>
                <asp:TemplateField HeaderText="OrderDetailsiD ">
                                        <ItemTemplate>
                                            <asp:Label ID="Label1" runat="server" Text="<%# Bind('OrderDetailsiD') %>"></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="order id">
                                        <ItemTemplate>
                                            <asp:Label ID="Label2" runat="server" Text="<%# Bind('orderID') %>"></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Product ID">
                                        <ItemTemplate>
                                            <asp:Label ID="Label3" runat="server" Text="<%# Bind('productID') %>"></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="QTY">
                                        <ItemTemplate >
                                            <asp:Label ID="Label4" runat="server" Text="<%# Bind('Qty') %>"></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                </Columns>
                                            <EditRowStyle BackColor="#999999" />
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
            <SortedAscendingCellStyle BackColor="#E9E7E2" />
            <SortedAscendingHeaderStyle BackColor="#506C8C" />
            <SortedDescendingCellStyle BackColor="#FFFDF8" />
            <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
                            </asp:GridView>
                            </div>
                        </td>
                        </tr>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
            <EditRowStyle BackColor="#999999" />
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
            <SortedAscendingCellStyle BackColor="#E9E7E2" />
            <SortedAscendingHeaderStyle BackColor="#506C8C" />
            <SortedDescendingCellStyle BackColor="#FFFDF8" />
            <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
        </asp:GridView>
    </div>
    </form>
</body>
</html>


C#
public partial class Default43 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            bind();
        }
 
    }
    void bind()
    {
        using (
              SqlConnection con =
                  new SqlConnection(ConfigurationManager.ConnectionStrings["testConnectionString"].ConnectionString))
        {
 
            SqlCommand cmd = new SqlCommand("select  *  from dbo.Orders ", con);
            DataTable dt = new DataTable();
            SqlDataAdapter adpt = new SqlDataAdapter(cmd);
            adpt.Fill(dt);
            GridView1.DataSource = null;
            GridView1.DataSource = dt;
            GridView1.DataBind();
 
        }
    }
    DataTable BindSecGrid(int id)
    {
        using (
                  SqlConnection con =
                      new SqlConnection(ConfigurationManager.ConnectionStrings["testConnectionString"].ConnectionString))
        {
 
            string Query = "select * from dbo.ODetails where orderID =" + id;
            SqlCommand cmd = new SqlCommand(Query, con);
            DataTable dt = new DataTable();
            SqlDataAdapter adpt = new SqlDataAdapter(cmd);
            adpt.Fill(dt);
 
            return dt;
        }
    }
 
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            GridView gv = ((GridView)e.Row.FindControl("GridView2"));
            if ((Label)e.Row.FindControl("lblID") is Label)
            {
                int id = Convert.ToInt32(((Label)e.Row.FindControl("lblID")).Text);
                gv.DataSource = BindSecGrid(id);
                gv.DataBind();
            }
            
        }
    }
}


SQL
CREATE TABLE [dbo].[ODetails](
    [OrderDetailsiD] [int] IDENTITY(1,1) NOT NULL,
    [orderID] [int] NULL,
    [productID] [int] NULL,
    [Qty] [int] NULL,
 CONSTRAINT [PK_ODetails] PRIMARY KEY CLUSTERED
(
    [OrderDetailsiD] ASC
)WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
) ON [PRIMARY]



SQL
CREATE TABLE [dbo].[Orders](
    [orderID] [int] IDENTITY(1,1) NOT NULL,
    [OrderAmount] [int] NULL,
    [date] [date] NULL,
 CONSTRAINT [PK_Orders] PRIMARY KEY CLUSTERED
(
    [orderID] ASC
)WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
) ON [PRIMARY]


Best Regards
M.Mitwalli
 
Share this answer
 
Comments
panduu 29-Jul-12 3:29am    
Thank u and it will be understandble.
please give me the DML operatins to perfrom(Gridview with in the Gridview) bcs somewhat it should be compex.
hey,

refer this, it ll help u lot
Gridview inside Gridview in ASP.NET C#[^]

Best luck
Happy Coding :)
 
Share this answer
 
Comments
Reza Ahmadi 24-Apr-12 3:36am    
My 5!
 
Share this answer
 
v2
Comments
Praful Karkar 22-Jul-14 3:07am    
Gridview inside Gridview in ASP.NET C#[^]

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900