Embedding DataGrid inside a DataGrid

Introduction

In this code sample, I will explain how you can embed one DataGrid inside another DataGrid. Here is what embedding DataGrid inside a DataGrid looks like:

Purpose

That's a good question. why does one want a DataGrid inside a DataGrid. Well, answer is simple, to view information in groups. Suppose if you have one user who has bought several items, you can view details by using child DataGrid inside main DataGrid.

NOTE

Please don't use open queries while accessing database. Always use stored procedures.

.cs code

private void Page_Load(object sender, System.EventArgs e)
{
  if(!Page.IsPostBack) 
  { 
    BindData(); 

  }
}

public void BindData() 
{ 
  SqlDataAdapter ad = new SqlDataAdapter("SELECT * FROM Categories",myConnection); 

  DataSet ds = new DataSet(); 
  ad.Fill(ds,"Categories"); 

  OuterGrid.DataSource = ds; 
  OuterGrid.DataBind(); 

}

protected DataView GetDataSource(Int32 catID) 
{ 
  string query = "SELECT * FROM Categories"; 
  SqlDataAdapter ad = new SqlDataAdapter(query,myConnection); 
  DataSet ds = new DataSet(); 
  ad.Fill(ds,"Categories"); 

  DataView _orders = ds.Tables["Categories"].DefaultView;
  _orders.RowFilter = "CategoryID='" + catID + "'";
  return _orders;

}

HTML sourcecode

OK. I am not able to paste the HTML code here. Something wrong with this editor. So I am going to tell you how to do it. It's simple. In the DataGrid HTML code, just add a DataSource tag and make the source equals to GetDataSource method as it is described earlier.

And that's it! I will surely try to update this article since the HTML code is missing!