Multiple Header rows in datagrid

Discussion in 'ASP .Net Datagrid Control' started by Alfred Salton, Jul 15, 2004.

  1. 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.
    Alfred Salton, Jul 15, 2004
    #1
    1. Advertising

  2. 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" <> wrote in message
    news:2004071421432016807%alfredsalton@hotmailcom...
    >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], Jul 15, 2004
    #2
    1. Advertising

  3. 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.
    Alfred Salton, Jul 15, 2004
    #3
    1. Advertising

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

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Alan_C
    Replies:
    1
    Views:
    589
    Joe Kesselman
    Sep 10, 2006
  2. mlt
    Replies:
    2
    Views:
    817
    Jean-Marc Bourguet
    Jan 31, 2009
  3. VijayRama
    Replies:
    2
    Views:
    2,295
    Gregory A. Beamer
    Oct 12, 2009
  4. Replies:
    0
    Views:
    222
  5. Suresh
    Replies:
    0
    Views:
    161
    Suresh
    Apr 16, 2004
Loading...

Share This Page