Advanced ASP.NET : Data-Access Components (part 2) - Using the Data-Access Component

2. Using the Data-Access Component

To use this component in a web application, you first have to make sure the appropriate connection string is configured in the web.config file, as shown here:

<configuration>

  <connectionStrings>
    <add name="AdBoard" connectionString=
"Data Source=localhost\SQLEXPRESS;Initial Catalog=AdBoard;Integrated Security=SSPI" />
  </connectionStrings>
  ...
</configuration>

					  

Next, compile and copy the component DLL file, or add a reference to it if you're using Visual Studio. The only remaining task is to add the user interface for the web page that uses the component.

To test this component, you can create a simple test page. In the example shown in Figure 2, this page allows users to browse the current listing by category and add new items. When the user first visits the page, it prompts the user to select a category.

Figure 2. The AdBoard listing

Once a category is chosen, the matching items display, and a panel of controls appears, which allows the user to add a new entry to the AdBoard under the current category, as shown in Figure 3.

Figure 3. The AdBoard listing

In order to access the component more easily, the web page imports its namespace:

Imports DatabaseComponent

The page code creates the component to retrieve information from the database and displays it by binding the DataSet to the drop-down list or GridView control:

Public Partial Class AdBoard
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, _
      ByVal e As System.EventArgs) Handles Me.Load

        If Not Page.IsPostBack
            Dim DB As New DBUtil()

            lstCategories.DataSource = DB.GetCategories()
            lstCategories.DataTextField = "Name"
            lstCategories.DataValueField = "ID"
            lstCategories.DataBind()

Code View: Scroll / Show All

pnlNew.Visible = False
        End If
    End Sub

    Protected Sub cmdDisplay_Click(ByVal sender As Object, _
      ByVal e As System.EventArgs) Handles cmdDisplay.Click

        Dim DB As New DBUtil()

        gridItems.DataSource = DB.GetItems( _
          Val(lstCategories.SelectedItem.Value))
        gridItems.DataBind()
        pnlNew.Visible = True
    End Sub

    Protected Sub cmdAdd_Click(ByVal sender As Object, _
      ByVal e As System.EventArgs) Handles cmdAdd.Click

        Dim DB As New DBUtil()

        Try
            DB.AddItem(txtTitle.Text, txtDescription.Text, _
              Val(txtPrice.Text), Val(lstCategories.SelectedItem.Value))

            gridItems.DataSource = DB.GetItems( _
              Val(lstCategories.SelectedItem.Value))
            gridItems.DataBind()
        Catch err As FormatException
            ' An error occurs if the user has entered an
            ' invalid price (non-numeric characters).
            ' In this case, take no action.
            ' Another option is to add a validator control
            ' for the price text box to prevent invalid input.
        End Try
    End Sub
End Class

					  

2.1. Dissecting the Code . . .

• Not all the functionality of the component is used in this page. For example, the page doesn't use the AddCategory() method or the version of GetItems() that doesn't require a category number. This is completely normal. Other pages may use different features from the component.

• The code for the web page is free of data access code. It does, however, need to understand how to use a DataSet, and it needs to know specific field names to create a more attractive GridView with custom templates for layout (instead of automatically generated columns).

• The page could be improved with error handling code or validation controls. As it is, no validation is performed to ensure that the price is numeric or even to ensure that the required values are supplied.

If you're debugging your code in Visual Studio, you'll find you can single-step from your web page code right into the code for the component, even if it isn't a part of the same solution. The appropriate source code file is loaded into your editor automatically, as long as it's available (and you've compiled the component in debug mode).