1. Home
  2. Computing & Technology
  3. Visual Basic

Learn ASP.NET 2.0 - Intro to the Grid Control
Completing the new page

By , About.com Guide

Apr 23 2008

With most of the work done by the data source, all you have to do is select this data source in the GridView control:

--------
Click Here to display the illustration
Click the Back button on your browser to return
--------

The data from the database is bound to the cells of the GridView using the BoundField object.

<asp:BoundField DataField="AVBQuestionDate"
   DataFormatString="{0:dd/MM/yyyy}"
   HeaderText="Date" SortExpression="AVBQuestionDate">
   <ItemStyle HorizontalAlign="Center" Width="100px" />
</asp:BoundField>

As you can see, it's possible to add some formatting. All of the formatting you see here was added to the page in Design view. Most was added by selecting "Professional" Auto Format. (A lot of properties are changed with this tool.) To format the date, I first selected the Columns collection for the GridView and then the Date field. The date was formatted using the string, "{0:dd/MM/yyyy}".

--------
Click Here to display the illustration
Click the Back button on your browser to return
--------

--------
Click Here to display the illustration
Click the Back button on your browser to return
--------

More extensive formatting is difficult with the BoundField object, so Microsoft has added the TemplateField object in ASP.NET 2.0. This object lets us program for our requirement to display something about the message text. Since the message text might be several pages long, it's not a good idea to simply make it another GridView column. TemplateField must be added in Source view inside the Columns tags. This will add one column to your GridView. Here's the code:

<asp:TemplateField HeaderText="Message Length">
   <ItemTemplate>
      <%#GetMsgLengthCategory(Eval("AVBQuestionMessage").length)%>
   </ItemTemplate>
</asp:TemplateField>

The key statement is ...

<%#GetMsgLengthCategory(Eval("AVBQuestionMessage").length)%>

Starting at the inside, Eval("AVBQuestionMessage") gets the data from the database. (The column must be added to the SELECT statement, too.) Then the length of this string is returned. This Integer value is passed to a Function - GetMsgLengthCategory - that still needs to be coded. Add it to the disp_msgs.aspx.vb file. Here's the way I coded it:

Partial Class disp_msgs
   Inherits System.Web.UI.Page
   Function GetMsgLengthCategory( _
      ByVal msglength As Integer) As String
      Select Case msglength
         Case 0 To 10
            Return "Tiny"
         Case 11 To 100
            Return "Short"
         Case 100 To 500
            Return "Average"
         Case Is > 500
            Return "Large"
         Case Else
            Return "Unknown"
      End Select
   End Function
End Class

Add a Hyperlink control to both the main Default.aspx page and our new page and we're ready to go. The end result is shown below:

--------
Click Here to display the illustration
Click the Back button on your browser to return
--------

Explore Visual Basic
By Category
About.com Special Features

Holiday Central

What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. Visual Basic
  4. Learn VB.NET
  5. Learn ASP.NET
  6. Learn ASP.NET 2.0 - Intro to the Grid Control

©2009 About.com, a part of The New York Times Company.

All rights reserved.