email article printer friendly get the code more resources

Create Data-Bound Controls With ASP.NET 2.0
ASP.NET 2.0 lets you build a data-bound custom control that ensures your data is always displayed consistently.
by Peter Vogel

July 29, 2005

Technology Toolbox: VB.NET, ASP.NET, ASP.NET 2.0

Thanks to the changes in databinding in ASP.NET 2.0, creating your own data-bound custom control is a simple task. I'll give you the foundation for any data-bound control you want to build.

ASP.NET 2.0's GridView control is a powerful tool, but you must reformat it constantly every time you want to use it. If you want to make sure your data is always displayed the same way but don't need the power of the GridView, you can create your own data-bound control. This will let you display your data simply by dragging your control onto the next form that you create.

The mechanics of databinding and, as a result, the mechanics of creating a data-bound control have changed dramatically from ASP.NET 1.* to ASP.NET 2.0. The good news is that the process is simple and flexible, allowing you to intervene in the process easily to tailor the results. I'll show you how to handle complex databinding to retrieve records. You can create a control that's bound to multiple records in order to generate a display that shows all of the records. In this case, I'll show you how to create a display-only control that displays a single field from a DataSource and displays the data in a table (see Figure 1, which shows the page in design view, and Figure 2, which shows the result at run time).

You must inherit from the System.Web.UI.WebControls.DataBoundControl class in order to create a control that supports complex databinding. You need to provide a way for developers to set databinding information, such as which data source to use, the name(s) of the fields to use, and so on. Then you must retrieve the data and move the data to the page.

Start your ASP.NET 2.0 custom control project in Visual Studio 2005 by creating a class library project, deleting the default class added to the project, and adding a Web Custom Control class to the project. All data-bound controls must inherit from System.Web.UI.WebControls.DataBoundControl class, so you need to alter the Inherits line in the class. The default code and property provided in the class module are going to be of no help to you either, so you should delete them to give this as your starting point:

Imports System.ComponentModel
Imports System.Web.UI

<ToolboxData("<{0}:CustomerList _
        runat=server></{0}:CustomerList>")> _
        Public Class CustomerList
        Inherits System.Web.UI.WebControls.WebControl

End Class

Your next step is to decide how many databinding properties you want to implement in your control (the DataBoundControl specifies only three: DataSource, DataSourceId, and DataMember). You need to implement only the DataTextField if you're creating a control that displays a single field in a fixed format. The base DataTextField property lets the developer using your control pick the field to display:

Private strDTF As String

Public Property DataTextField() As String
        Get
                If strDTF Is Nothing Then
                        Return String.Empty
                Else
                        Return strDTF
                End If
        End Get

        Set(ByVal value As String)
                strDTF = value
        End Set

End Property