ASP.NET GridView Tutorial

Drilldown and display hierarchical data in gridview using objectdatasource control – Part 35

Link for csharp, asp.net, ado.net, dotnet basics and sql server video tutorial playlists
http://www.youtube.com/user/kudvenkat/playlists

Link for text version of this video
http://csharp-video-tutorials.blogspot.com/2013/03/drilldown-and-display-hierarchical-data_27.html

In this video, we will discuss about drilling down and displaying hierarchical data in gridview controls using objectdatasource control. We will be using the following 3 database tables for this demo.
1. tblContinents
2. tblCountries
3. tblCities

1. When the page loads, a gridview should display the list of all continents available in tblContinents table
2. When a “Select” button is clicked against a continent, all the countries belonging to the selected continent should be displayed in another gridview.
3. Along the same lines, when a “Select” button is clicked against a country, all the cities belonging to the selected country should be displayed in another gridview.

Use sql script from Part 34 using the link below to create and populate the required tables.
http://csharp-video-tutorials.blogspot.com/2013/03/drilldown-and-display-hierarchical-data.html

To use objectdatasource controls, to retrieve continents, countries and cities data, we need to create respective data access layer class files.

Step 1: Implement ContinentDataAccessLayer.cs.

Step 2: Implement CountryDataAccessLayer.cs.

Step 3: Implement CityDataAccessLayer.cs.

Step 4: Build your solution, so that the respective data access layer classes are compiled.

Step 5: Drag and drop 3 gridview controls and 3 Objectdatasource controls on webform1.aspx.

Step 6: Configure ObjectDataSource1 control to retrieve data from ContinentDataAccessLayer. Use GetAllContinents() as the SELECT method.

Step 7: Asscociate ObjectDataSource1 control with Gridview1 control.

Setp 8: From GridView1 – GridView Tasks pane, please make sure “Enable selection” checkbox is checked.

Step 9: Configure ObjectDataSource2 control to retrieve data from CountryDataAccessLayer. Use GetCountriesByContinent(int ContinentId) as the SELECT method. The value for the parameter – ContinentId should come fromt the selected row in GridView1 control.

Step 10: Asscociate ObjectDataSource2 control with Gridview2 control.

Step 11: From GridView2 – GridView Tasks pane, please make sure “Enable selection” checkbox is checked.

Step 12: Configure ObjectDataSource3 control to retrieve data from CityDataAccessLayer. Use GetCitiesByCountryId(int CountryId) as the SELECT method. The value for the parameter – CountryId should come fromt the selected row in GridView2 control.

Step 13: Asscociate ObjectDataSource3 control with Gridview3 control.

Step 14: Flip the webform to HTML source mode and set
GridView1 DataKeyNames property to “ContinentId”
GridView2 DataKeyNames property to “CountryId”