datagrid - Header span over multiple columns



I have a datagrid in which the header needs to span over 2
columns. I have tried creating a tableCells and tableRow at runtime and
set the columnspan property of a cell to 2. But, the heading does not
look good and is not aligned to the datagrid columns. Is there another
way to do it?
Any help would be great!!




Ken Cox [Microsoft MVP]

Hi Sam,

Here's some code that should get you going on this. Let us know if it helps?

Microsoft MVP [ASP.NET]

Dim dt As DataTable
Private Sub Page_Load _
(ByVal sender As System.Object, _
ByVal e As System.EventArgs) _
Handles MyBase.Load
DataGrid1.ShowHeader = True
DataGrid1.DataSource = CreateDataSource()
End Sub
Private Sub DataGrid1_ItemDataBound _
(ByVal sender As Object, _
ByVal e As _
System.Web.UI.WebControls.DataGridItemEventArgs) _
Handles DataGrid1.ItemDataBound
' Have the first column header span
' two columns
' by Ken Cox Microsoft MVP [ASP.NET]
If e.Item.ItemType = ListItemType.Header Then
' Declare variables
Dim dgItem As DataGridItem
Dim tcells As TableCellCollection
Dim fcell As TableCell
Dim scell As TableCell
' Get a reference to the header row item
dgItem = e.Item
' Get a reference to the cells in the
' header row item
tcells = e.Item.Cells
' Get a reference to the cell we want to
' span. In this case, the first cell
fcell = e.Item.Cells(0)
' Set the text of the span cell
fcell.Text = "This is the spanned cell"
' Set the columns to span to 2
fcell.ColumnSpan = 2
' Get a reference to the second cell
scell = e.Item.Cells(1)
' Remove the second cell because it will
' be replaced by the spanning column
End If
End Sub
Function CreateDataSource() As ICollection
' Create sample data for the DataList control.
dt = New DataTable
Dim dr As DataRow

' Define the columns of the table.
dt.Columns.Add(New DataColumn("Student", GetType(String)))
dt.Columns.Add(New DataColumn("Subject", GetType(String)))
dt.Columns.Add(New DataColumn("Day", GetType(String)))

' Populate the table with sample values.
dr = dt.NewRow
dr(0) = "Ben"
dr(1) = "English"
dr(2) = "Thursday"
dr = dt.NewRow
dr(0) = "Ben"
dr(1) = "Geology"
dr(2) = "Monday"
dr = dt.NewRow
dr(0) = "Ben"
dr(1) = "Physics"
dr(2) = "Tuesday"
Dim dv As DataView = New DataView(dt)
Return dv
End Function

<form id="Form1" method="post" runat="server">
<asp:DataGrid id="DataGrid1" runat="server"></asp:DataGrid>


Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question