articles

Home / DeveloperSection / Articles / Expandable and Collapsible Rows in Datagrid in C# Winforms

Expandable and Collapsible Rows in Datagrid in C# Winforms

Expandable and Collapsible Rows in Datagrid in C# Winforms

Devesh Omar 33621 18-Jun-2014

Expandable and Collapsible Rows in Datagrid in C# Winforms


Introduction

Hi Friends, Today, 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 a 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:

  • First, we need to create Master and child tables.
  • To identify the relationship between tables we should have Primary and Foreign Keys in tables 
  • Here we are creating a data_table for master and child tables.
  • 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)); 

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));

The understanding Relationship between Master and child table
Expandable and Collapsible Rows in Datagrid in C# Winforms
 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");

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 the master and child table to the dataset.

DataSet dsDataset = new DataSet();
           dsDataset.Tables.Add(dtstudent);
            dsDataset.Tables.Add(dtstudentMarks);

Defining the relationship between Master and child table

DataRelation

 Datatablerelation = new DataRelation("DetailsMarks", dsDataset.Tables[0].Columns[0], dsDataset.Tables[1].Columns[0],true);
            dsDataset.Relations.Add(Datatablerelation);

 Adding Datagrid control in Winforms

As per screen below we can add Datagrid to WinForms

Right-click in toolbar -> choose an item  

Expandable and Collapsible Rows in Datagrid in C# Winforms 

    Binding data         dataGrid1.DataSource = dsDataset.Tables[0]; 

  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];
 
        }

Running code

We will get the following screen having expandable rows in Datagrid.

Expandable and Collapsible Rows in Datagrid in C# Winforms

Expanding row to see details 

Expandable and Collapsible Rows in Datagrid in C# Winforms 

Click on DetailsMarks to get Marks details 

Expandable and Collapsible Rows in Datagrid in C# Winforms 

Details screen for student_Id=222 

Expandable and Collapsible Rows in Datagrid in C# Winforms 

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 

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 relationships.

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

according to requirement

 


Updated 25-May-2020
I am Software Professional

Leave Comment

Comments

Liked By