All geek questions in one place

Nested gridview example

I searched for more than one day to create a nested gridview that can be added to the form of a C # window. I found many examples that use ASP.NET, however I could not find anything that was done with C #. I would like the main / detailed Gridview to look like the one shown in the following link: http://ilovedeveloper.blogspot.com/2009/05/nested-gridview-using-c.html

+6
source share
4 answers

IMAGE

Your requirement

.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CS.aspx.cs" Inherits="CS" %> <!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> <style type="text/css"> body { font-family: Arial; font-size: 10pt; } .Grid td { background-color: #A1DCF2; color: black; font-size: 10pt; line-height:200% } .Grid th { background-color: #3AC0F2; color: White; font-size: 10pt; line-height:200% } .ChildGrid td { background-color: #eee !important; color: black; font-size: 10pt; line-height:200% } .ChildGrid th { background-color: #6C6C6C !important; color: White; font-size: 10pt; line-height:200% } </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript"> $("[src*=plus]").live("click", function () { $(this).closest("tr").after("<tr><td></td><td colspan = '999'>" + $(this).next().html() + "</td></tr>") $(this).attr("src", "images/minus.png"); }); $("[src*=minus]").live("click", function () { $(this).attr("src", "images/plus.png"); $(this).closest("tr").next().remove(); }); </script> </head> <body> <form id="form1" runat="server"> <asp:GridView ID="gvCustomers" runat="server" AutoGenerateColumns="false" CssClass="Grid" DataKeyNames="CustomerID" OnRowDataBound="OnRowDataBound"> <Columns> <asp:TemplateField> <ItemTemplate> <img alt = "" style="cursor: pointer" src="images/plus.png" /> <asp:Panel ID="pnlOrders" runat="server" Style="display: none"> <asp:GridView ID="gvOrders" runat="server" AutoGenerateColumns="false" CssClass = "ChildGrid"> <Columns> <asp:BoundField ItemStyle-Width="150px" DataField="OrderId" HeaderText="Order Id" /> <asp:BoundField ItemStyle-Width="150px" DataField="OrderDate" HeaderText="Date" /> </Columns> </asp:GridView> </asp:Panel> </ItemTemplate> </asp:TemplateField> <asp:BoundField ItemStyle-Width="150px" DataField="ContactName" HeaderText="Contact Name" /> <asp:BoundField ItemStyle-Width="150px" DataField="City" HeaderText="City" /> </Columns> </asp:GridView> </form> </body> </html>

WITH#

 using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; using System.Data.SqlClient; using System.Configuration; public partial class CS : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { gvCustomers.DataSource = GetData("select top 10 * from Customers"); gvCustomers.DataBind(); } } private static DataTable GetData(string query) { string strConnString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString; using (SqlConnection con = new SqlConnection(strConnString)) { using (SqlCommand cmd = new SqlCommand()) { cmd.CommandText = query; using (SqlDataAdapter sda = new SqlDataAdapter()) { cmd.Connection = con; sda.SelectCommand = cmd; using (DataSet ds = new DataSet()) { DataTable dt = new DataTable(); sda.Fill(dt); return dt; } } } } } protected void OnRowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) { string customerId = gvCustomers.DataKeys[e.Row.RowIndex].Value.ToString(); GridView gvOrders = e.Row.FindControl("gvOrders") as GridView; gvOrders.DataSource = GetData(string.Format("select top 3 * from Orders where CustomerId='{0}'", customerId)); gvOrders.DataBind(); } } }
+12
source

you can use the template column to create a nested gridview, you need to create an HTML table inside the template column in the first row of the column, filling in the main grid rows using custom binding using the databound row event. you click add the grid view of the grid inside the second row of the html table

check with the following link .. http://www.dotnetfox.com/articles/multilevel-nested-gridview-in-Asp-Net-using-C-Sharp-1012.aspx

0
source 
 SqlConnection con = new SqlConnection("Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB"); protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { BindGridview(); } } // This method is used to bind gridview from database protected void BindGridview() { con.Open(); SqlCommand cmd = new SqlCommand("select TOP 4 CountryId,CountryName from Country", con); SqlDataAdapter da = new SqlDataAdapter(cmd); DataSet ds = new DataSet(); da.Fill(ds); con.Close(); gvParentGrid.DataSource = ds; gvParentGrid.DataBind(); } protected void gvUserInfo_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) { con.Open(); GridView gv = (GridView)e.Row.FindControl("gvChildGrid"); int CountryId = Convert.ToInt32(e.Row.Cells[1].Text); SqlCommand cmd = new SqlCommand("select * from State where CountryID=" + CountryId, con); SqlDataAdapter da = new SqlDataAdapter(cmd); DataSet ds = new DataSet(); da.Fill(ds); con.Close(); gv.DataSource = ds; gv.DataBind(); } }
0
source

Source: https://habr.com/ru/post/952832/

More articles:


All Articles