Before You Begin:

WebGrid™ can use any DataSource that implements the IList, ITypedList or IBindingList Interface as well as the DataTable and DataSet. The most powerful of these is the DataSet, which can contain multiple DataTables with relation constraints to define the hierarchical relationships between the DataTables. To display hierarchical data, WebGrid must be provided with a DataSource containing two or more DataTables and the DataTable relationships. The DataSet provides the capabilities needed by WebGrid for the display and maintenance of hierarchical data.

This project creates a "Customers" DataTable and an "Orders" DataTable and adds them to a DataSet. Then a relationship between the two DataTables is created and added to the DataSet. Finally, the completed DataSet is bound to WebGrid.

The CreateDataSet method contains all the code relevant to creating the DataSets and the relationship between them. The PageLoad Event contains the code relevant to binding the DataSet to WebGrid.

Follow These Steps:

1. Declare a New DataSet and name it "CustomerOrders":

   In Visual Basic:

   ' Declare DataSet to contain Hierarchical data 
   Dim dataset As New System.Data.DataSet("CustomerOrders")

   In C#:

   // Declare DataSet to contain Hierarchical data
   DataSet ds = new DataSet();

2. Create a DataTable containing Customer data and add it to the DataSet:

   In Visual Basic:

   ' Customer DataTable
   Dim dt As New DataTable("Customer")
   dt.Columns.Add("CustomerID", GetType(Integer))
   dt.Columns.Add("CustomerName", GetType(String))
   dt.Columns.Add("Date", GetType(DateTime))
   dt.Rows.Add(New Object() {1, "John Lever", DateTime.Now})
   dt.Rows.Add(New Object() {2, "Walter Smith", DateTime.Now.AddDays(1)})
   dt.Rows.Add(New Object() {3, "Kathy Lever", DateTime.Now.AddDays(2)})
   dt.Rows.Add(New Object() {4, "George Wills", DateTime.Now.AddDays(3)})
   ds.Tables.Add(dt)

   In C#:

   // Customer DataTable
   DataTable dt = new DataTable("Customer");
   dt.Columns.Add("CustomerID", typeof(int));
   dt.Columns.Add("CustomerName", typeof(string));
   dt.Columns.Add("Date", typeof(DateTime));
   dt.Rows.Add(new object[] {1, "John Lever", DateTime.Now});
   dt.Rows.Add(new object[] {2, "Walter Smith", DateTime.Now.AddDays(1)});
   dt.Rows.Add(new object[] {3, "Kathy Lever", DateTime.Now.AddDays(2)});
   dt.Rows.Add(new object[] {4, "George Wills", DateTime.Now.AddDays(3)});
   ds.Tables.Add(dt);

3. Create a DataTable containing Order data and add it to the DataSet:

   In Visual Basic:

   ' Orders DataTable
   dt = New DataTable("Orders")
   dt.Columns.Add("OrderID", GetType(Integer))
   dt.Columns.Add("ProductName", GetType(String))
   dt.Columns.Add("Price", GetType(Double))
   dt.Columns.Add("Quantity", GetType(Integer))
   dt.Rows.Add(New Object() {1, "Bolts", 2.3, 15})
   dt.Rows.Add(New Object() {1, "Screws", 2.03, 55})
   dt.Rows.Add(New Object() {1, "Nails", 1.01, 25})
   dt.Rows.Add(New Object() {2, "Bolts", 2.3, 65})
   dt.Rows.Add(New Object() {2, "Screws", 2.03, 75})
   dt.Rows.Add(New Object() {2, "Nails", 1.01, 95})
   dt.Rows.Add(New Object() {3, "Bolts", 2.3, 65})
   dt.Rows.Add(New Object() {3, "Screws", 2.03, 205})
   dt.Rows.Add(New Object() {3, "Screws", 2.03, 205})
   dt.Rows.Add(New Object() {4, "Bolts", 2.3, 695})
   ds.Tables.Add(dt)

   In C#:

   // Orders DataTable
   dt = new DataTable("Orders");
   dt.Columns.Add("OrderID", typeof(int));
   dt.Columns.Add("ProductName", typeof(string));
   dt.Columns.Add("Price", typeof(double));
   dt.Columns.Add("Quantity", typeof(int));
   dt.Rows.Add(new object[] {1, "Bolts", 2.30, 15});
   dt.Rows.Add(new object[] {1, "Screws", 2.03, 55});
   dt.Rows.Add(new object[] {1, "Nails", 1.01, 25});
   dt.Rows.Add(new object[] {2, "Bolts", 2.30, 65});
   dt.Rows.Add(new object[] {2, "Screws", 2.03, 75});
   dt.Rows.Add(new object[] {2, "Nails", 1.01, 95});
   dt.Rows.Add(new object[] {3, "Bolts", 2.30, 65});
   dt.Rows.Add(new object[] {3, "Screws", 2.03, 205});
   dt.Rows.Add(new object[] {3, "Nails", 1.01, 265});
   dt.Rows.Add(new object[] {4, "Bolts", 2.30, 695});
   ds.Tables.Add(dt);

4. Create a relationship between the Customers and Orders and add it to the DataSet:

   In Visual Basic:

   ' Create customers/orders relationship and add to DataSet 
   ds.Relations.Add("Customer_Orders", ds.Tables("Customer").Columns("CustomerID"),
   	ds.Tables("Orders").Columns("OrderID"))
   ' Set the WebGrid's view type to Hierarchical
   Me.UltraWebGrid1.DisplayLayout.ViewType = _
     Infragistics.WebUI.UltraWebGrid.ViewType.Hierarchical 

   In C#:

   // Create customers/orders relationship and add to DataSet
   ds.Relations.Add("Customer_Order", ds.Tables["Customer"].Columns["CustomerID"], 
   	ds.Tables["Orders"].Columns["OrderID"]);
   // Set the WebGrid's view type to Hierarchical
   this.UltraWebGrid1.DisplayLayout.ViewType = 
     Infragistics.WebUI.UltraWebGrid.ViewType.Hierarchical;

5. Bind the DataSet to the WebGrid:

   In Visual Basic:

   ' Bind the DataSet to the Grid 
   CreateDataSet()
   Me.UltraWebGrid1.DataSource = ds.Tables("Customer")
   Me.UltraWebGrid1.DataBind()

   In C#:

   // Bind the DataSet to the Grid 
   CreateDataSet();
   this.UltraWebGrid1.DataSource = ds.Tables["Customer"];
   this.UltraWebGrid1.DataBind();
   

What You Accomplished:

This project demonstrates the ease with which a Hierarchical DataSet can be created, populated, and bound to the WebGrid.