Multiple Header rows in datagrid

[Alfred Salton]

I have a need for multiple header rows in a datagrid. One header row
contains the column headings, the next header row contains html input
fields, buttons and other controls and serves as a template for
javascript functions to add and delete rows from the table without a
round trip to the server (too much latency involved in each round
trip). The template row has a css display style set to none -
javascript and the web DOM are used to clone it and add a new row to
the table when requested by the user.

Is this possible using the datagrid? Can anyone give a simple code example?

I also need to be able to serialize/unserialize the contents of the
table as an XML file to retain the items as a working draft document
over time. I believe this is more easily done with the datagrid control
than an html table object, but I welcome suggestions.

 

[Ken Cox [Microsoft MVP]]

Hi Alfred,

I don't think this is as sophisticated as what you need, but code below
might give you ideas on how to create a second header.
If you are trying to show and hide portions of the data, be sure to check
out Hierargrid at http://www.denisbauer.com/ASPNETControls/HierarGrid.aspx

Let us know how you make out?

Ken
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()
DataGrid1.DataBind()
End Sub
Private Sub DataGrid1_ItemDataBound _
(ByVal sender As Object, _
ByVal e As _
System.Web.UI.WebControls.DataGridItemEventArgs) _
Handles DataGrid1.ItemDataBound
' Add a second header with a flag button in it
' by Ken Cox Microsoft MVP [ASP.NET]
If e.Item.ItemType = ListItemType.Header Then
' Get the collection of cells from the grid
Dim tcells As TableCellCollection
' Create an imagebutton
Dim imgBtn As New ImageButton
' Assign the URL
imgBtn.ImageUrl = "http://www.gc.ca/images/flag.gif"
' Get the collection of existing cells so we can get a count
tcells = e.Item.Cells
' Create a new cell
Dim fcell As New TableCell
' Add the image button to the new table cell
fcell.Controls.Add(imgBtn)
' Span the cell to however many columns there are
fcell.ColumnSpan = tcells.Count
' Create a new header object
Dim dgItemHeader As New DataGridItem _
(0, 0, ListItemType.Header)
' Add the cell to the header
dgItemHeader.Cells.Add(fcell)
dgItemHeader.Visible = True
' Add the header to the datagrid
DataGrid1.Controls(0).Controls.Add(dgItemHeader)
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"
dt.Rows.Add(dr)
dr = dt.NewRow
dr(0) = "Ben"
dr(1) = "Geology"
dr(2) = "Monday"
dt.Rows.Add(dr)
dr = dt.NewRow
dr(0) = "Ben"
dr(1) = "Physics"
dr(2) = "Tuesday"
dt.Rows.Add(dr)
Dim dv As DataView = New DataView(dt)
Return dv
End Function

 

[Alfred Salton]

Thanks Ken,

This really makes the solution more complicated, though. The repeater
control looks better suited to the problem - the datagrid is just too
rigid, and seems designed with very simple data structures in mind.

I'm familiar with Denis Bauer's HierarGrid, and like it. The problem
still remains, though, that with anything but trivial applications the
latency involved in going to the server to evaluate each row is a
problem.

Now my only problem is serializing/deserializing the data and UI
without alot of messy code.

Cheers.