Home   Preview the Book   Chapter 15, TOC   Part 10

  Previous: Modifying the Structure of a Web Page in Code
  Next: Encapsulating Design Elements in Controls

Incorporating Bound Data into a Web Page

If you download the code for this chapter, you can check out all of the HTML originally delivered with the VB Snippets design. As you will see, the design versions of many of the Web pages, including index.htm, show tabular information in HTML tables. In VB Snippets, however, we plan to bind those displays to current database information. Therefore, the ASPX pages replace those tables in the design with data-bound controls.

VB Snippets uses the DataGrid control in several pages to display bound data. Templates customize the displays within the columns of the grid. Listing 15-1 defines the DataGrid used in the content area of the index.aspx page. The columns element defines the three column-display, with an asp:templatecolumn element enclosing the definition of each column. Because this is a display-only Web application, only itemtemplate elements are included within each column.

Listing 15-1. The grdNewExamples DataGrid in index.aspx

<asp:datagrid id="grdNewExamples" runat="server" cellpadding="5"
    cssclass="tborder" autogeneratecolumns="False">
    <headerstyle horizontalalign="Center" cssclass="thead"></headerStyle>
    <itemstyle cssclass="tmain"></itemstyle>
    <columns>
        <asp:templatecolumn itemstyle-borderwidth="2" headerstyle-borderwidth="2"
            itemstyle-horizontalalign="Center" itemstyle-wrap="False" >
            <itemtemplate>
                <a href='<%# Container.DataItem("Link") %>'> 
                    <%=rm.GetString("ViewCode")%></a>
            </itemtemplate>
        </asp:templatecolumn>
        <asp:templatecolumn itemstyle-borderwidth="2" headerstyle-borderwidth="2"
            itemstyle-horizontalalign="Center" itemstyle-wrap="False" >
            <itemtemplate>
                <%# Container.DataItem("Date") %><br>
                <asp:label id="lblNew" runat="server" cssclass="new" >
                    <%# Container.DataItem("New") %></asp:label>
            </itemtemplate>
        </asp:templatecolumn>
        <asp:templatecolumn headertext="Description" itemstyle-borderwidth="2"
            headerstyle-borderwidth="2">
            <itemtemplate><%# Container.DataItem("Description") %>
                <p class="topsep" /><b><%=rm.GetString("keywords")%></b>
                <%# Container.DataItem("Keywords") %>
            </itemtemplate>
        </asp:templatecolumn>
    </columns>
</asp:datagrid>

As you can see in Listing 15-1, a data grid can display both localized strings and bound data. You can also add information to a data grid programmatically as we did here:

Me.grdNewExamples.Columns(0).HeaderText = rm.GetString("GrabIt")
Me.grdNewExamples.Columns(1).HeaderText = rm.GetString("Added")
Me.grdNewExamples.Columns(2).HeaderText = rm.GetString("Description")

This code adds the localized header strings that appear at the top of each column in the grid.

All data for the grid displays comes from methods of the CVbCode class, which provides all access to the VbCode database. Later in this chapter, we take a look at the inner workings of this class. When a visitor is logged in, the following code retrieves and binds data for the grdNewExamples display:

Me.grdNewExamples.DataSource = oCode.NewExamples( _
    NewExampleDate:=oVisitor.LastVisit, _
    StartDate:=CDate(Me.txtSearchDate.Text), _
    Culture:=_sCulture)
Me.grdNewExamples.DataBind()

Here, the oCode and oVisitor variables reference instances of the CVbCode and CVisitor classes, respectively. The private _sCulture variable specifies the language to display for the current visitor.

To complete the implementation of a Web design, you work through each page, converting its HTML content into the ASPX equivalent. In the natural order of things, some pages will be somewhat complex and others will be very simple. To verify for yourself the straightforward nature of this process, you can compare the Web pages in the VB Snippets case study with the HTML versions delivered by the Web designer.

From a Visual Basic .NET programmer’s perspective, the implementation of controls used within the Web pages provides a more interesting challenge. Now let’s take a look at the controls used in the VB Snippets case study.

  Previous: Modifying the Structure of a Web Page in Code
  Next: Encapsulating Design Elements in Controls

Home   Preview the Book   Chapter 15, TOC   Part 10

Copyright © 1996 - 2017 SoftMedia Artisans, Inc. All Rights Reserved.