Server Intellect
 
Home   Asp.Net Tutorials   What's New   Newsletter   More Resources
 
 
  Categories
Advanced Technologies
AJAX
Internet Browsers
Controls
Database
Email
Error Handling
File
Graphics
Website Navigation
Network
Performance
User Interface and Themes
Validation
Visual Web Developer
Web Services
XML
Suggest Tutorial


Navigator: Home - Tutorials - Controls - GridViewComplexHead using ASP.NET 2.0 and VB
GridViewComplexHead using ASP.NET 2.0 and VB


ASP.NET Controls Tutorial

The ICollection interface is the base interface for classes in the System.Collections namespace. Dictionary and IList are more specialized interfaces that are based on the ICollection interface. An IDictionary implementation is a collection of key-and-value pairs, like the Hashtable class. An IList implementation is a collection of values that can be sorted and whose members can be accessed by index, like the Array List class.We use the DataTable to add column. And use the DataRow to add row. We use the Literal control to reserve a location on the Web page to display text. The Literal control is similar to the Label control, except the Literal control does not allow you to apply a style to the displayed text. You can programmatically control the text displayed in the control by setting the Text property. We use the Literal control to add complex head.

This tutorial will show you how to add GridViewComplexHead using ASP.NET 2.0 and VB.NET .First, you  need to import the System.Collections namespace.

We can add complex table head to GridView. We use the Literal control to add table head.

Imports System.Collections

We moved our web sites to Server Intellect and have found them to be incredibly professional. Their setup is very easy and we were up and running in no time.

The ICollection interface is the base interface for classes in the System.Collections namespace. Dictionary and IList are more specialized interfaces that are based on the ICollection interface. An IDictionary implementation is a collection of key-and-value pairs, like the Hashtable class. An  IList implementation is a collection of values that can be sorted and whose members can be accessed by index, like the Array List class.We use the DataTable  to add column. And use the DataRow to add row. We use the Literal control to reserve a location on the Web page to display text. The Literal control is similar to the Label control, except the Literal control does not allow you to apply a style to the displayed text. You can programmatically control the text displayed in the control by setting the Text property.
We use the Literal control to add complex head.

We use the Page_Load event to display data. And use the GridView1_RowCreated event to create complex head. We use the GridView1_RowDataBound to set color.

Partial Class GridViewComplexHead
Inherits System.Web.UI.Page
Protected Function CreateDataSource() As ICollection
Dim dt As New System.Data.DataTable()
Dim dr As System.Data.DataRow
Dim i As Integer

dt.Columns.Add(New System.Data.DataColumn("Class", System.Type.GetType("System.String")))
dt.Columns.Add(New System.Data.DataColumn("Name", System.Type.GetType("System.String")))
dt.Columns.Add(New System.Data.DataColumn("Literature", System.Type.GetType("System.Decimal")))
dt.Columns.Add(New System.Data.DataColumn("Math", System.Type.GetType("System.Decimal")))
dt.Columns.Add(New System.Data.DataColumn("English", System.Type.GetType("System.Decimal")))
dt.Columns.Add(New System.Data.DataColumn("Computer", System.Type.GetType("System.Decimal")))

For i = 0 To 7
Dim rd As New System.Random(Environment.TickCount * i)
dr = dt.NewRow()
dr(0) = "Class" + i.ToString()
dr(1) = "Student" + i.ToString()
dr(2) = System.Math.Round(rd.NextDouble() * 100, 2)
dr(3) = System.Math.Round(rd.NextDouble() * 100, 2)
dr(4) = System.Math.Round(rd.NextDouble() * 100, 2)
dr(5) = System.Math.Round(rd.NextDouble() * 100, 2)
dt.Rows.Add(dr)
Next
Dim dv As New System.Data.DataView(dt)
Return dv
End Function

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
' This tutorial is provided in part by Server Intellect Web Hosting Solutions http://www.serverintellect.com
' Visit http://www.AspNetTutorials.com for more ASP.NET Tutorials
If IsPostBack = False Then
GridView1.BorderColor = System.Drawing.Color.DarkOrange
GridView1.DataSource = CreateDataSource()
GridView1.DataBind()
End If
End Sub

Protected Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.Header Then
Dim rowHeader As New GridViewRow(0, 0, DataControlRowType.Header, DataControlRowState.Normal)
Dim HeaderBackColor As String = "#EDEDED"
rowHeader.BackColor = System.Drawing.ColorTranslator.FromHtml(HeaderBackColor)

Dim newCells As New Literal()
newCells.Text = "Table Head letter1</th><th colspan='2'>Table Head letter2</th><th colspan='2'>Table Head letter3</th><th>Table Head letter4</th></tr><tr bgcolor='" + HeaderBackColor + "'>"
newCells.Text += "<th colspan='2'>Table Head letter5</th><th rowspan='2'>Table Head letter6</th><th colspan='2'>Table Head letter7</th></tr><tr bgcolor='" + HeaderBackColor + "'>"
newCells.Text += " <th>Table Head letter8</th><th>Table Head letter9</th><th>Table Head letter10</th><th>Table Head letter11</th><th>Table Head letter12"

Dim cells As TableCellCollection = e.Row.Cells
Dim headerCell As New TableHeaderCell()

headerCell.RowSpan = 2
headerCell.Controls.Add(newCells)
rowHeader.Cells.Add(headerCell)

rowHeader.Cells.Add(headerCell)
rowHeader.Visible = True

GridView1.Controls(0).Controls.AddAt(0, rowHeader)
End If
End Sub

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.Header Then
e.Row.Attributes.Add("style", "background:#9999FF;color:#FFFFFF;font-size:14px")
Else
e.Row.Attributes.Add("style", "background:#FFF")
End If
End Sub
End Class

I just signed up at Server Intellect and couldn't be more pleased with my Windows Server! Check it out and see for yourself.

The front end Default.aspx page looks something like this:

<asp:GridView ID="GridView1" runat="server" CellSpacing="1" CellPadding="3" Font-Size="12px" Width="600px" BackColor="Transparent" BorderWidth="0px" OnRowDataBound="GridView1_RowDataBound" OnRowCreated="GridView1_RowCreated">
</asp:GridView>

Server Intellect assists companies of all sizes with their hosting needs by offering fully configured server solutions coupled with proactive server management services. Server Intellect specializes in providing complete internet-ready server solutions backed by their expert 24/365 proactive support team.

The flow for the code behind page is as follows.

Imports System.Collections
Partial Class GridViewComplexHead
Inherits System.Web.UI.Page

Protected Function CreateDataSource() As ICollection
Dim dt As New System.Data.DataTable()
Dim dr As System.Data.DataRow
Dim i As Integer

dt.Columns.Add(New System.Data.DataColumn("Class", System.Type.GetType("System.String")))
dt.Columns.Add(New System.Data.DataColumn("Name", System.Type.GetType("System.String")))
dt.Columns.Add(New System.Data.DataColumn("Literature", System.Type.GetType("System.Decimal")))
dt.Columns.Add(New System.Data.DataColumn("Math", System.Type.GetType("System.Decimal")))
dt.Columns.Add(New System.Data.DataColumn("English", System.Type.GetType("System.Decimal")))
dt.Columns.Add(New System.Data.DataColumn("Computer", System.Type.GetType("System.Decimal")))

For i = 0 To 7
Dim rd As New System.Random(Environment.TickCount * i)
dr = dt.NewRow()
dr(0) = "Class" + i.ToString()
dr(1) = "Student" + i.ToString()
dr(2) = System.Math.Round(rd.NextDouble() * 100, 2)
dr(3) = System.Math.Round(rd.NextDouble() * 100, 2)
dr(4) = System.Math.Round(rd.NextDouble() * 100, 2)
dr(5) = System.Math.Round(rd.NextDouble() * 100, 2)
dt.Rows.Add(dr)
Next
Dim dv As New System.Data.DataView(dt)
Return dv
End Function

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
' This tutorial is provided in part by Server Intellect Web Hosting Solutions http://www.serverintellect.com
' Visit http://www.AspNetTutorials.com for more ASP.NET Tutorials
If IsPostBack = False Then
GridView1.BorderColor = System.Drawing.Color.DarkOrange
GridView1.DataSource = CreateDataSource()
GridView1.DataBind()
End If
End Sub

Protected Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.Header Then
Dim rowHeader As New GridViewRow(0, 0, DataControlRowType.Header, DataControlRowState.Normal)
Dim HeaderBackColor As String = "#EDEDED"
rowHeader.BackColor = System.Drawing.ColorTranslator.FromHtml(HeaderBackColor)

Dim newCells As New Literal()
newCells.Text = "Table Head letter1</th><th colspan='2'>Table Head letter2</th><th colspan='2'>Table Head letter3</th><th>Table Head letter4</th></tr><tr bgcolor='" + HeaderBackColor + "'>"
newCells.Text += "<th colspan='2'>Table Head letter5</th><th rowspan='2'>Table Head letter6</th><th colspan='2'>Table Head letter7</th></tr><tr bgcolor='" + HeaderBackColor + "'>"
newCells.Text += " <th>Table Head letter8</th><th>Table Head letter9</th><th>Table Head letter10</th><th>Table Head letter11</th><th>Table Head letter12"

Dim cells As TableCellCollection = e.Row.Cells
Dim headerCell As New TableHeaderCell()

headerCell.RowSpan = 2
headerCell.Controls.Add(newCells)
rowHeader.Cells.Add(headerCell)

rowHeader.Cells.Add(headerCell)
rowHeader.Visible = True

GridView1.Controls(0).Controls.AddAt(0, rowHeader)
End If
End Sub

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.Header Then
e.Row.Attributes.Add("style", "background:#9999FF;color:#FFFFFF;font-size:14px")
Else
e.Row.Attributes.Add("style", "background:#FFF")
End If
End Sub
End Class

Download the Full Working Version of this Project written with Visual Studio.NET VB.NET 2005 Here!

Looking for the C#.NET 2005 Version? Click Here!

Looking for more ASP.NET Tutorials? Click Here!







 
  Developer Resources







Server Intellect Rocks