Introduction

Here I will describe how to show Expandable/ Collapsible rows in datagrid in C#

This is applicable to those cases where we have to display master and child content / rows.

Example Student Table

Here in this example we have list of Students and inside we have details of student marks

Expandable and Collapsible Rows in Datagrid in C# Winforms

Details View
Expandable and Collapsible Rows in Datagrid in C# Winforms 

Our purpose is to display this type of data using C#  Winforms

Expected Output in window forms would be

Expandable and Collapsible Rows in Datagrid in C# Winforms

 

Expandable and Collapsible Rows in Datagrid in C# Winforms

 

 

Steps and Code:

  1. First we need to create Master and child tables.
  2. To identify the relationship between tables we should have Primary and Foreign Keys in tables 
  3. Here we are creating datatable for master and child tables.
  4. Master table  (student)
                //Parent table
            DataTable dtstudent = new DataTable();
            dtstudent.Columns.Add("Student_ID"typeof(int));
            dtstudent.Columns.Add("Student_Name"typeof(string));
            dtstudent.Columns.Add("Student_RollNo"typeof(string));

 

  1. Child Table (Student Marks)
//Child table
            DataTable dtstudentMarks = new DataTable();
            dtstudentMarks.Columns.Add("Student_ID"typeof(int));
            dtstudentMarks.Columns.Add("Subject_ID"typeof(int));
            dtstudentMarks.Columns.Add("Subject_Name"typeof(string));
            dtstudentMarks.Columns.Add("Marks"typeof(int));

f.  Understanding Relation ship between Master and child table


Expandable and Collapsible Rows in Datagrid in C# Winforms

g.  In brief


dtstudent.StudentID = dtstudentMarks.StudentID 


Adding Rows to Master table (Student Table)

//Adding Rows
 
            dtstudent.Rows.Add(111, "Devesh""03021013014");
            dtstudent.Rows.Add(222, "ROLI""0302101444");
            dtstudent.Rows.Add(333, "ROLI Ji""030212222");
            dtstudent.Rows.Add(444, "NIKHIL""KANPUR");

i.  Adding Row to Child table (Student Marks table)

   // data for devesh ID=111
            dtstudentMarks.Rows.Add(111, "01","Physics", 99);
            dtstudentMarks.Rows.Add(111, "02","Maths", 77);
            dtstudentMarks.Rows.Add(111, "03","C#", 100);
            dtstudentMarks.Rows.Add(111, "01","Physics", 99);
 
 
            //data for ROLI ID=222
            dtstudentMarks.Rows.Add(222, "01""Physics", 80);
            dtstudentMarks.Rows.Add(222, "02""English", 95);
            dtstudentMarks.Rows.Add(222, "03""Commerce", 95);
            dtstudentMarks.Rows.Add(222, "01""BankPO", 99); 

Adding master and child table to dataset.

DataSet dsDataset = new DataSet();
           dsDataset.Tables.Add(dtstudent);
            dsDataset.Tables.Add(dtstudentMarks);
  1. Defining relationship between Master and child table
  2. DataRelation
 Datatablerelation = new DataRelation("DetailsMarks", dsDataset.Tables[0].Columns[0], dsDataset.Tables[1].Columns[0],true);
            dsDataset.Relations.Add(Datatablerelation);

 

 l.  Adding Datagrid control in winforms

As per screen below we can add datagrid to winforms

Right click in tool bar -> choose item 

 

Expandable and Collapsible Rows in Datagrid in C# Winforms 


m.    Binding data


dataGrid1.DataSource = dsDataset.Tables[0]; 


n.      All code together


private void Form1_Load(object sender, EventArgs e)
        {
            //Parent table
            DataTable dtstudent = new DataTable();
            // add column to datatable  
            dtstudent.Columns.Add("Student_ID"typeof(int));
            dtstudent.Columns.Add("Student_Name"typeof(string));
            dtstudent.Columns.Add("Student_RollNo"typeof(string));
 
           
            //Child table
            DataTable dtstudentMarks = new DataTable();
            dtstudentMarks.Columns.Add("Student_ID"typeof(int));
            dtstudentMarks.Columns.Add("Subject_ID"typeof(int));
            dtstudentMarks.Columns.Add("Subject_Name"typeof(string));
            dtstudentMarks.Columns.Add("Marks"typeof(int));
           
 
 
            //Adding Rows
 
            dtstudent.Rows.Add(111, "Devesh""03021013014");
            dtstudent.Rows.Add(222, "ROLI""0302101444");
            dtstudent.Rows.Add(333, "ROLI Ji""030212222");
            dtstudent.Rows.Add(444, "NIKHIL""KANPUR");
 
                // data for devesh ID=111
            dtstudentMarks.Rows.Add(111, "01","Physics", 99);
            dtstudentMarks.Rows.Add(111, "02","Maths", 77);
            dtstudentMarks.Rows.Add(111, "03","C#", 100);
            dtstudentMarks.Rows.Add(111, "01","Physics", 99);
 
 
            //data for ROLI ID=222
            dtstudentMarks.Rows.Add(222, "01""Physics", 80);
            dtstudentMarks.Rows.Add(222, "02""English", 95);
            dtstudentMarks.Rows.Add(222, "03""Commerce", 95);
            dtstudentMarks.Rows.Add(222, "01""BankPO", 99);
 
 
 
            DataSet dsDataset = new DataSet();
            //Add two DataTables  in Dataset
 
            dsDataset.Tables.Add(dtstudent);
            dsDataset.Tables.Add(dtstudentMarks);
 
           
            DataRelation Datatablerelation = new DataRelation("DetailsMarks", dsDataset.Tables[0].Columns[0], dsDataset.Tables[1].Columns[0], true);
            dsDataset.Relations.Add(Datatablerelation);
            dataGrid1.DataSource = dsDataset.Tables[0];
 
        }

o.      Running code


We will get following screen having expandable rows in datagrid.

Expandable and Collapsible Rows in Datagrid in C# Winforms

p.      Expanding row to see details 


Expandable and Collapsible Rows in Datagrid in C# Winforms 


q.      Click on DetailsMarks to get Marks details 


Expandable and Collapsible Rows in Datagrid in C# Winforms 


r.        Details screen for student_Id=222 


Expandable and Collapsible Rows in Datagrid in C# Winforms 


s.       Go to back for Master details


Click on highlighted back button to go master detail form 


Expandable and Collapsible Rows in Datagrid in C# Winforms 

t.        Main form


Expandable and Collapsible Rows in Datagrid in C# Winforms 

Conclusion 


We have learned how to show data in datagrid with master and child relationship.

Also this code can be used directly in project but you need to change this code

according to requirement

 

  Modified On Nov-30-2017 06:08:12 AM
  1. how to work (+) btn click qty increment and (-) btn click qty decrement then save
    Project: asp.net
    solve language: C# or javascript

Leave Comment