Update (10/8/2010): With the Q2 2010 release, a few things changed in RadGridView's API. Most notably, the MasterGridViewTemplate property has been deprecated and replaced with the MasterTemplate property. Due to this, and other changes, I've decided to update this blog entry to contain the latest available information.

A while back, I posted a video on Telerik TV explaining the different techniques you can use to create a hierarchical RadGridView (Please note that the video was recorded prior to Q2, so there may be a few minor differences between the RadGridView in the video and the one that is currently available). Today I thought I would take some time out to explain those techniques in more detail here on my blog.

Note: If you download any of the hierarchy demo projects and are using an x64 version of Windows, you will need to be sure to set the compiler options for the project to x86. The reason for this is that all of these projects use an MS Access database, and there is currently no x64 driver available for accessing MS Access databases from the .NET Framework.

Auto Generating Hierarchy

Setting up an auto generating hierarchy is probably the easiest route you can take when working with hierarchies and the RadGridView. The only downside to automatically generating the hierarchy is that you must use DataSets. To show you how this works, I've created a small demo application that uses a music collection access database. In my project, I've created a DataSet based on this database and its three tables called MusicCollectionDataSet. The relationships defined in this DataSet are what the RadGridView is going to use to automatically generate the hierarchy.

Figure 1. The MusicCollectionDataSet

As you can see in Figure 1, the relationships that the hierarchy grid will be based on are the AlbumsSongs and ArtistsAlbums relationships. Setting up the hierarchy to automatically generate is quite simple. You need an instance of the MusicCollectionDataSet and instances of its various table adapters that have been filled with data from the database. After this, all you need to do is set the AutoGenerateHierarchy property of the RadGridView to true, specify the DataSource as the MusicCollectionDataSet, and specify the DataMember as the top level table to display in the hierarchy. In this case, the top level table is the "Artists" table.

Running the application yields a hierarchy, three levels deep, that has been automatically generated.

Figure 2. The Auto Generated Hierarchy Application

Click here to download the source code for this example.

Manually Creating the Hierarchy

Using this technique takes a little more work than using auto generation, but the advantage here is that you are not restricted to using DataSets. You can also more easily modify the layouts of the various child templates using the Visual Studio designer.

For this example, I've actually used the same exact database as in the first example, the MusicCollection database. I've once again created a DataSet based on this database (exactly like Figure 1 above). The major difference here is that I am not going to use the relationships contained within the DataSet to generate the hierarchy. I am going to instead use specific ID fields from the tables to define the relationships manually. Due to this, you actually don't have to use a DataSet to manually create a hierarchy, you simply need a set of classes that has a known relationship based on a particular ID/Key field.

In the Visual Studio designer, I have created several binding sources specific to each table contained within the MusicCollectionDataSet. They are, albumsBindingSource, artistsBindingSource, and songsBindingSource. Using the SmartTag on the RadGridView, I've set its DataSource to be the top level BindingSource, artistsBindingSource.

Figure 3. The Binding Sources

In the SmartTag menu of RadGridView under the Templates collection, I've added a new template with the albumsBindingSource set as its DataSource.

 
Figure 4. The Albums GridViewTemplate

This GridViewTemplate (gridViewTemplate1) also has a property for adding child Templates. Since our hierarchy should expand to a third level past albums to display songs, we need to add a child GridViewTemplate here as well. This child GridViewTemplate's DataSource needs to be songsBindingSource.

Figure 5. The Songs GridViewTemplate

Back in the designer, the RadGridView contains a property called Relations. This is where we need to define the relationships between all of the data sources. For the relationship between artists and albums, I've specified the following:

ChildColumnName: ArtistID
ChildTemplate: gridViewTemplate1
ParentColumnName: ArtistID
ParentTemplate: radGridView.MasterTemplate
RelationName: ArtistsAlbums 

I've also created a relationship between the albums and songs tables:

ChildColumnName: AlbumID
ChildTemplate: gridViewTemplate2
ParentColumnName: AlbumID
ParentTemplate: gridViewTemplate1
RelationName: AlbumsSongs 

Running the application yields a hierarchy, three levels deep, that functions in exactly the same way as the auto-generated hierarchy from the first example.

Figure 6. The Manual Hierarchy Application

Click here to download the source code for this example.

Hierarchy of Multiple One-to-Many Relations

The RadGridView also supports hierarchies that contain objects with multiple one-to-many relations. When it encounters this scenario it displays each child GridViewTemplate in its own separate tab. Setting up this type of hierarchy is very simple. For this example, I am using the following DataSet based on a Contacts database.

Figure 7. The Contacts DataSet

The Contacts table contains two separate one-to-many relationships. Getting the information from these tables to display in the hierarchy follows a very similar technique to what we did in example 2. In the RadGridView SmartTag menu, under the Templates collection, I simply added two new GridViewTemplates. The first uses the emailAddressesBinding source as its DataSource. The seconds uses the phoneNumbersBindingSource as its DataSource. Having two ChildGridViewTemplates in this collection ensures that they will show up as tabbed child views under their parent GridViewTemplate.

The relationships are also defined in a similar way.

ContactsEmailAddresses Relationship:

ChildColumnName: ContactID
ChildTemplate: gridViewTemplate3
ParentColumnName: ContactID
ParentTemplate: radGridView.MasterTemplate
RelationName: ContactsEmailAddresses 

ContactsPhoneNumbers Relationship:

ChildColumnName: ContactID
ChildTemplate: gridViewTemplate2
ParentColumnName: ContactID
ParentTemplate: radGridView.MasterTemplate
RelationName: ContactsEmailAddresses 

Running the application yields a GridView containing contacts that can be expanded to show email addresses and phone numbers associated with a particular contact in tabbed child views.

Figure 8. The Tabbed Child Views Application

Click here to download the source code for this example.