Cómo mostrar múltiples columnas en el encabezado de un GridView con ASP.NET

Estrada Web Group
Administrador
Cómo mostrar múltiples columnas en el encabezado de un GridView con ASP.NET

aprende asp.net

En ocasiones es posible que necesitemos mostrar varias columnas en una sola columna en el encabezado de un GridView, el mejor ejemplo es como lo hacemos normalmente en un archivo de Excel, tal vez puedas entender a lo que me refiero viendo la imagen del artículo.

 

Para hacer este tipo de cosas podemos utilizar el evento RowDataBound para dar formato a la fila de encabezado del GridView. Creo que cuando mire el código puede ver que es muy sencillo hacer esto. Así que sin perder el tiempo voy a proporcionarle el código para realizar esto.

HTML

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="Row_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="GridView1" runat="server"
        onrowdatabound="GridView1_RowDataBound">
    </asp:GridView>

    </div>
    </form>
</body>
</html>

VB.NET

Imports System.Data

Partial Class Row_Default
    Inherits System.Web.UI.Page
    Shared dt As DataTable = Nothing
    Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
        CreateDataTable()
    End Sub
    Private Sub CreateDataTable()

        If dt Is Nothing Then
            Dim cols As String() = {"Age Group", "Admin", "Systems", "HR", "MX"}
            Dim data As String(,) = {{"18-25", "25", "20", "35", "40"}, {"25-35", "25", "75", "65", "45"}, {"35-45", "25", "35", "20", "16"}}
            dt = New DataTable()
            For Each str As String In cols
                dt.Columns.Add(str)
            Next
            For i As Integer = 0 To 2
                Dim dr As DataRow = dt.NewRow()
                For j As Integer = 0 To 4
                    dr(j) = data(i, j)
                Next
                dt.Rows.Add(dr)
            Next
        End If
        GridView1.DataSource = dt
        GridView1.DataBind()
    End Sub

    Protected Sub GridView1_RowDataBound(sender As Object, e As GridViewRowEventArgs) Handles GridView1.RowDataBound
        Dim gvRow As GridViewRow = e.Row
        If gvRow.RowType = DataControlRowType.Header Then
            If gvRow.Cells(0).Text = "Age Group" Then
                gvRow.Cells.Remove(gvRow.Cells(0))
                Dim gvHeader As New GridViewRow(0, 0, DataControlRowType.Header, DataControlRowState.Insert)
                Dim headerCell0 As New TableCell() With { _
                     .Text = "Age Group", _
                     .HorizontalAlign = HorizontalAlign.Center, _
                     .RowSpan = 2 _
                }
                Dim headerCell1 As New TableCell() With { _
                     .Text = "No. Of Employees", _
                     .HorizontalAlign = HorizontalAlign.Center, _
                     .ColumnSpan = 4 _
                }
                gvHeader.Cells.Add(headerCell0)
                gvHeader.Cells.Add(headerCell1)
                GridView1.Controls(0).Controls.AddAt(0, gvHeader)
            End If
        End If
    End Sub
End Class

Espero que todos hayan disfrutado el ejemplo, pero sobre todo les puede ayudar en sus proyectos.

Compartir artículo:

Más artículos geniales

Aprende a integrar pagos con PayPal en ASP.NET Core: Integrar el SDK de JavaScript de PayPal

Aprende a integrar pagos con PayPal en ASP.NET Core: Integrar el SDK de JavaScript de PayPal

En este artículo te enseñare a integrar el SDK de JavaScript de PayPal para utilizarlo en ASP.NET Core para recibir pagos en tu página web y te mostrare como incluir botones de PayPal en tu sitio web

Ver artículo completo
Aprende a integrar pagos con PayPal en ASP.NET Core: Credenciales API Sandbox para realizar pagos

Aprende a integrar pagos con PayPal en ASP.NET Core: Credenciales API Sandbox para realizar pagos

En este artículo te mostrare donde puedes obtener las Credenciales API Sandbox para recibir pagos en tu página web desarrollada con ASP.NET Core y explicare los tipos de API que existen en PayPal, además creare unos artículos donde te mostrare como integrar PayPal en tu sitio web ASP.NET Core.

Ver artículo completo

Manténgase actualizado

Obtenga excelente contenido en su bandeja de entrada todas las semanas.
Solo contenido excelente, no compartimos su correo electrónico con terceros.
Subir al inicio de la pantalla ;