Maintain hierarchical information using XML and TreeView control

• Download source and demo files - 143 Kb

Introduction

We need to develop a system that allows maintaining hierarchical data on the web. The application would have enriching presentation i.e. it would allow the movement of nodes. Allow me to introduce you to the prototype.

The application allows manipulating (add, delete, move right, move up, move down etc.) the tree nodes.

P.S. This is rather a simplified version of the problem. We’ll evolve this problem with time. Right now, we’ll concern ourselves only with the presentation of the application.

Solution

Lets start with the architecture of the application. The application will follow the layered pattern with presentation, business and data layer. Let’s discuss the design for the application. The application in the web presentation cluster.

Let me elucidate the architecture of the solution for you. Let's start by looking at the application at the architecture level of abstraction. From the application viewpoint, the application is an Object-Oriented Application that is logically structured as a Three-Layered Services Application. Right now, I am not interested with the database, infrastructure and deployment viewpoint for the sake of simplicity.

This concisely describes the architecture of the solution across all four of the viewpoints to anyone familiar with the referenced patterns.

Continuing down one level of abstraction, let’s describe the design of the system:

From the application viewpoint, let's consider each layer of our Three-Layered Services Application separately. The presentation layer is structured around a Web presentation framework based on Model-View-Controller (MVC). The business layer holds the business entities. The complex Web Application Deployment Model calls for separate web and application tiers. Therefore, the two tiers communicate through a Broker.

To continue, down one more level of abstraction, we can describe the implementation of the solution:

Let's look at the solution from the application viewpoint. The solution is built using Microsoft .NET technology. The presentation layer is based on the web presentation framework that is built into ASP.NET. ASP.NET simplifies the implementation of Model-View-Controller with the built-in code-behind page feature. We use the built-in Page Controller mechanism in ASP.NET to implement our presentation logic. The domain objects in the business layer are managed .NET objects. Because the presentation layer and business layer may be deployed on separate tiers, we use Implementing Broker with .NET remoting, using Server-Activated Objects. Finally, the data layer is based on the ADO.NET classes within the .NET framework to provide database access. The Microsoft Application Blocks for .NET building blocks would provide the exception management.

Implementation

First about the requirements:

• You would require IE web controls installed on the machine before running this example. You can download/install these from this location.
• Download the code and make the treeviewnet directory as virtual directory.

Let’s move on to the implementation. As we are concerned with the web presentation layer only (for the time being), we’ll talk about the components in this layer only.

The web presentation layer implements MVC pattern with default ASP.NET controller (i.e. provided by ASP.NET).

Now, the main project (in .NET terms) would be treeviewnet. It would utilize the services of SystemFramework for exception management. I’ll explain the exception management block (although it’s the block provided by Microsoft) in the next article. For the time being, assume it’s just there.

Let’s examine the crux i.e. the Treeviewnet namespace. Here is the class diagram for this namespace. For the sake of simplicity, only the required classes are displayed in the diagram. We might evolve this also with time and articles.

The heart of the application is the TreeViewHelperAdmin class. This is the class that deals with all the actions performed on the TreeView web control. Now, here is a design decision that had to be made. As this class would be required at multiple locations, I didn’t want to instantiate it again and again. One option of achieving this was using the singleton pattern for instantiating this. The other option of course was to make static methods in this class. I adopted the second approach. The downfall for this approach is that you wouldn’t be able to override these methods. But then, you could always create a method with new keyword. Mind you, this is not always advisable. But, this was an acceptable design in the case of this application.

The utility class, TreeUtility has quite a few utility methods as displayed in the class diagram. The code is documented, so there shouldn’t be any problem in understanding it. But, I must warn you that it would require persistence and perseverance. In any case, I would discuss these methods in case I get requests for that.

The View i.e. the Proposal.aspx in this case utilizes the other classes with its Model i.e. its code-behind class. There is no front controller or page controller in this application right now. But, as I always say, it gotta fit-in someday.

The application is entirely XML based. All the functions for manipulating the hierarchy of the data are accomplished with the usage of XML only. Alternate approach to this was to maintain the states in the database and manipulate the web presentation view using database. Incidentally, I abhor this approach. Why in the world would I need that (at least I had no cogent reason for that)? Besides if I had followed that, this particular article wouldn’t have been possible without database layer and business layer. Now perhaps you can imagine the meaning (not to mention importance) of loose coupling in between the layers.

A few buttons on the toolbar wouldn’t work right now. Don’t worry, that’s intentional.

Summary

This is the first in the series of articles on this topic. But, I plan to put in that kind of effort only if people get interested. And if they were, I would talk about patterns, data access methods, and Microsoft application blocks and of course, the code explanation. Happy reading folks.