GridView anidado en ASP .Net
En ocasiones, en nuestras aplicaciones web con ASP .Net necesitamos mostrar datos en una cuadricula pero agrupando algunos registros. Algo así como el típico caso de Maestro Detalle, pero el detalle dentro de la misma grilla. En ASP .Net esto se resuelve fácilmente con el control GridView, para obtener el resultado siguente:
El gráfico anterior muestra a un GridView que muestra los datos como maestro detalle. Ahora veremos como es posible hacer esto en una aplicación.
En el caso anterior, la grilla principal tiene 3 columnas, una para el Id. Cat., la segunda para la Categoría y la tercera, será un Template que contendrá otro GridView en su ItemTemplate, esa es la parte fácil; la parte más fácil se da en el evento RowDataBound del GridView principal, ya que este evento se ejecuta cada vez que se enlaza una fila del gridview a los datos que mostrará.
Ya en este evento lo que se debe hacer es simplemente crear una vista de la tabla de detalle filtrando los datos que necesitamos por el id de la tabla maestro. Para poder acceder al GridView que se encuentra en la tercera columnna de la grilla principal simplemente aplicamos una conversión del objeto en la coluna correspondiente, tal y como se muestra en la linea:
GridView gdv = (GridView)e.Row.Cells[2].FindControl(“gdvProductos”);
Hay que considerar que el evento RowDataBoundse ejecuta segun la cantidad de registros que se muestran en el GirdView es decir, si tu GridView tiene 10 filas, este evento se ejecutará 10 veces.
Y el título de las cabeceras? Pues eso es mas fácil aún, se trata de dibujar la tabla HTML dentro de las etiquetas HeaderTemplate de la tercera columna y listo!
Espero que les sea de utilidad.
Descargar Ejemplo GridView Anidado
Saludos.
este ejemplo me ayudo mucho gracias
Un ejemplo buenisimo …
gracias por la ayuda.
Excelente ejemplo… Muchas Gracias Hanz !!!…
Un abrazo.
PD: Te envio el codigo por detras en VB para que agregues si te interesa al ejemplo (para evitar a otros usuarios tener que convertir el C#…)
———————————————————–
Imports System.Data
Partial Class GridAnidado
Inherits System.Web.UI.Page
Private dts As New DataSet
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not Page.IsPostBack Then
LlenarDatos()
gdvCategorias.DataSource = dts.Tables(“tblCat”).DefaultView
gdvCategorias.DataBind()
End If
End Sub
Protected Sub gdvCategorias_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gdvCategorias.RowDataBound
If (e.Row.RowType = DataControlRowType.DataRow) Then
Dim idCat As String = e.Row.Cells(0).Text
Dim vst As DataView = New DataView(dts.Tables(“tblPro”), “idCat=” + idCat, String.Empty, DataViewRowState.CurrentRows)
Dim gdv As GridView = e.Row.Cells(2).FindControl(“gdvProductos”)
gdv.DataSource = vst
gdv.DataBind()
End If
End Sub
Protected Sub LlenarDatos()
Dim tblCat As DataTable = New DataTable(“tblCat”)
tblCat.Columns.Add(New DataColumn(“idCat”, Type.GetType(“System.String”)))
tblCat.Columns.Add(New DataColumn(“categoria”, Type.GetType(“System.String”)))
tblCat.Rows.Add(New Object() {“1″, “Categoria 1″})
tblCat.Rows.Add(New Object() {“2″, “Categoria 2″})
tblCat.Rows.Add(New Object() {“3″, “Categoria 3″})
tblCat.Rows.Add(New Object() {“4″, “Categoria 4″})
tblCat.Rows.Add(New Object() {“5″, “Categoria 5″})
dts.Tables.Add(tblCat)
Dim tblPro As DataTable = New DataTable(“tblPro”)
tblPro.Columns.Add(New DataColumn(“idPro”, Type.GetType(“System.String”)))
tblPro.Columns.Add(New DataColumn(“producto”, Type.GetType(“System.String”)))
tblPro.Columns.Add(New DataColumn(“idCat”, Type.GetType(“System.String”)))
tblPro.Rows.Add(New Object() {“1″, “Producto 1″, “1″})
tblPro.Rows.Add(New Object() {“2″, “Producto 2″, “1″})
tblPro.Rows.Add(New Object() {“3″, “Producto 3″, “2″})
tblPro.Rows.Add(New Object() {“4″, “Producto 4″, “2″})
tblPro.Rows.Add(New Object() {“5″, “Producto 5″, “3″})
tblPro.Rows.Add(New Object() {“6″, “Producto 6″, “4″})
tblPro.Rows.Add(New Object() {“7″, “Producto 7″, “4″})
tblPro.Rows.Add(New Object() {“8″, “Producto 8″, “4″})
tblPro.Rows.Add(New Object() {“9″, “Producto 9″, “5″})
tblPro.Rows.Add(New Object() {“10″, “Producto 10″, “5″})
dts.Tables.Add(tblPro)
End Sub
End Class
buenas tardes tengo una duda se que no tiene relacion con esto pero bueno:
espero y me puedas ayudar desde hace ya rato que mi servidor web se cayo pero egun esto ya quedo pero apartir de alli cuando trato de cargarle algun codigo este no se actualiza al 100% o no se actualiza antes lo hacia con el remot de visual studio directamente al servidor pero desde que se daño el server ya no lo puedo hacer me dice que no tiene las extenciones de front page y ya se las trate de instalar pero nada no me permite espero y me puedan ayudar
Muchas gracias por el aporte, excelente articulo, gratificante encontrar algo tan bueno y en español.
Saludos desde Medellin-Colombia