Tip 1: Building Reusable Data Maintenance Functions with Event Delegation (Part 1 of 3)
At some point, most developers have had to build a web database application that featured several data entry screens. Most of them probably resembled something like
Figure 2: an entry screen for employees (or products, or tax codes, etc.), along with a navigation toolbar, and a toolbar for other data maintenance functions.
 | |
| Figure 2. Basic Database Application: Here's a basic three-tab entry page with a reusable toolbar. |
Building these functions might seem boring or even mundane. However, there's nothing mundane about situations where developers spend hours and hours duplicating functionality across multiple screens—or implementing the functionality inconsistently. The ideal solution is to reuse code and select reusable methodologies so you can build these data maintenance functions quickly and efficiently.
Writing a reusable user interface (UI) toolbar in a web browser environment presents some interesting challenges, especially if you want to build a separate class for any maintenance functions associated with the toolbar options. For instance, you may have buttons to navigate through records, and the navigation methods might exist in a different library. Fortunately, you can use a technique known as
event delegation. In this technique, you will do the following:
- In the user control, publish an event for each toolbar button.
- In any web form that contains the user control, associate (or "wire," if you will) the published event from the first step to any method. The method could be a base method from a base ASP.NET page class from which the web form is derived.
Follow these steps to build some reusable data maintenance functions (working from the inside out):
- Create an ASP.NET page class (inherited from System.Web.UI.Page) that will contain public properties and virtual functions for the common editing and navigating tasks.
- Create a master page that contains all of the visual controls (toolbar and command buttons).
- In the master page, create event handlers for each of the toolbar command buttons.
- For each data maintenance page, associate each event handler with the actual corresponding virtual function.
You might be saying, "OK, that makes sense." Or you may be saying, "Huh???" Well, fret not, the next tip will cover these steps in detail.
Tip 2: Reusable Data Maintenance Functions (Part 2 of 3)
Tip 1 covered the four general steps for producing a reusable solution; this tip and the next covers those steps in detail.
First, you need to create the ASP.NET page class that will contain public properties and virtual functions for the common editing and navigating tasks. Start by creating a new ASP.NET page class:
public class cgsBaseWebEditPage:System.Web.UI.Page
In the ASP.NET page class, you'll need to define properties for generic data maintenance, such as the number of rows in the current result set that the user is navigating, the relative row position based on the current view order, and so forth:
public int ParentPosition { get; set; }
public int ParentPrimaryKey { get; set; }
public DataView ParentView { get; set; }
Finally, still in the ASP.NET page class, you'll want to add base virtual methods to handle the core maintenance tasks. For instance, here's the method to navigate to the next row, based on the current view:
public virtual void NavigateNext(object sender, EventArgs e)
{
if (this.ParentPosition <
this.ParentView.Count)
{
this.ParentPosition++;
this.SetCurrentKey();
this.RetrieveDataForKey();
}
}
The method simply increments the
ParentPosition property, sets the
ParentPrimaryKey value, and retrieves the data from the database based on the
ParentPrimaryKey value.
The method that sets the current key value is as follows:
public virtual void SetCurrentKey()
{
this.ParentPrimaryKey =
Convert.ToInt32(
this.ParentView[this.ParentPosition]
[this.ParentKeyName]);
}
Finally, the method
RetrieveDataForKey is simply a stub virtual method that you can override when you subclass this ASP.NET page class. In your subclassed web page, you can access the
ParentPrimaryKey value to retrieve the full row from the database for that key.
OK, I hope that was easy. In the next tip, you'll build the master page and create the event handlers to cover steps 2-4.
Tip 3: Reusable Data Maintenance Functions (Part 3 of 3)
Now that you've created the ASP.NET page class, you can focus on the master page, the event handlers, and then create a web page that consumes all of this.
From the list of steps in Tip 1, you'll need to create a master page that contains all of the visual controls (toolbar and command buttons). You can create any type of master page with command buttons like those shown in
Figure 2.
Next, you can create event handlers for each of the toolbar command buttons. Here is one example, based on the
NavigateNext method. At the top of the master page you can specify the following event handler:
public event EventHandler NextEventClick;
protected void OnEventNext(EventArgs e)
{
if (this.NextEventClick != null)
this.NextEventClick(this, e);
}
Then, in the
Click event of the "next" command button in the MasterPage toolbar, you can insert the following code to call the
OnEventNext method:
protected void btnNext_Click(object sender,
ImageClickEventArgs e)
{
OnEventNext(e);
}
This will, in turn, call any method that you "wire" to the
NextEventClick method.
Finally, you can wire the
NextEventClick method to the base method
NavigateNext (from the base web edit page) when you create any application web page, (a customer page, a product page, and so forth):
DataMaintenanceMaster oMaster =
(DataMaintenanceMaster)this.Master;
oMaster.NextEventClick +=
new EventHandler(this.NavigateNext);
Previous Page
