Click here to Skip to main content
13,351,985 members (89,106 online)
Click here to Skip to main content
Add your own
alternative version


29 bookmarked
Posted 18 May 2009

Cell Merging In GridView

, 18 May 2009
Rate this:
Please Sign up or sign in to vote.
A way to describe how to merge cells in GridView
Click to enlarge image


In many ASP.NET applications, we use the GridView control for displaying data. It is a very helpful control and powerful indeed. Many operations can be done using the Gridview control but the UI presentation is more important as it is the look-n-feel that matters a lot. In this small article, I will demonstrate how the cells of the grid can be merged as I have been asked to do the same in one of my recent projects.

Application & Program Overview

public DataTable MyDataTable()
        DataTable dtsource = new DataTable();

        //Adding columns to datatable

        //Adding records to the datatable
        dtsource.Rows.Add("1", "Name1", "20", "Address1", 
			"Male", "20/12/1978", "1978","Student");
        dtsource.Rows.Add("2", "Name2", "21", "Address2", 
			"Male", "20/12/1984", "1984", "Doctor");
        dtsource.Rows.Add("3", "Name3", "22", "Address3", 
			"Male", "10/11/1943", "1943", "Software Eng.");
        dtsource.Rows.Add("4", "Name4", "23", "Address4", 
			"Male", "12/12/1956", "1956", "Police man");
        dtsource.Rows.Add("5", "Name5", "24", "Address5", 
			"Male", "11/01/1856", "1856", "CEO");
        dtsource.Rows.Add("6", "Name6", "25", "Address6", 
			"Female", "29/12/2008", "2008", "Manager");
        dtsource.Rows.Add("7", "Name7", "26", "Address7", 
			"Female", "29/12/2004", "2004", "Business man");
        dtsource.Rows.Add("8", "Name8", "27", "Address8", 
			"Female", "29/12/1956", "1956", "Student");
        dtsource.Rows.Add("9", "Name9", "28", "Address9", 
			"Female", "15/10/2009", "2009", "Project Manager");
        dtsource.Rows.Add("10", "Name10", "29", "Address10", 
			"Female", "29/12/2010", "2010", "Doctor");

        return dtsource;

In the Page_Load event, I have populated the grid from the datasource defined above.

protected void Page_Load(object sender, EventArgs e)
        DataSource objdatasource = new DataSource();
        grMergedCellExample.DataSource = objdatasource.MyDataTable();

Gridview has many events out of which one is RowCreated. This event comes into the picture when a row gets created in the GridView control.

The GridViewRow object gets created even before the GridView is rendered.That means any custom content can be added to the row whenever this event gets fired. Henceforth, I have written my code in the GridView’s RowCreated event.


There are 7 cells in the grid. They are:

  1. User Id
  2. Name
  3. Age
  4. Address
  5. Sex
  6. DOB
  7. Year
  8. Designation

Out of these, I want to merge columns c, d (i.e. Age, Address) under the column name "Merged Column(Age-Address)" and columns f, g & h (i.e. DOB, Year, Designation) under the column name "Merged Column(DOB-Year-Designation)".

Columns a & b (i.e. User Id & Name) will remain as it is so as column e, i.e. Sex.

The first thing that I checked is whether the grid row type is header or not.

if (e.Row.RowType == DataControlRowType.Header)

Next I created objects for GridView, GridViewRow and Tablecell.

//Creating a gridview object            
GridView objGridView = (GridView)sender;

//Creating a gridview row object
GridViewRow objgridviewrow = new GridViewRow
		(1, 0, DataControlRowType.Header, DataControlRowState.Insert);

//Creating a table cell object
TableCell objtablecell = new TableCell();

The function AddMergedCells(GridViewRow objgridviewrow, TableCell objtablecell, int colspan,string celltext) does the needed operation. Among the four parameters, the last two are the most important ones because the colspan parameter will decide how many rows to span while the celltext holds the Header message to display. The implemented function is given below:

/// Function : AddMergedCells
/// Purpose: Adds merged cell in the header
/// </summary>
/// <param name=""objgridviewrow""></param>
/// <param name=""objtablecell""></param>
/// <param name=""colspan""></param>
private static void AddMergedCells (GridViewRow objgridviewrow, 
	TableCell objtablecell, int colspan,string celltext)
    objtablecell = new TableCell();
    objtablecell.Text = celltext;
    objtablecell.ColumnSpan = colspan;

How the function is being called is of also utter importance. e.g.:

Case I

I don't want to merge the first two cells. The calling function in that case will pass the following parameter values:

AddMergedCells(objgridviewrow, objtablecell,2,string.Empty);

Case II

I want to merge the third & fourth cells. In such a case, the colspan will be 2 while the celltext will have the header text. The calling function in that case will pass the following parameter values:

AddMergedCells(objgridviewrow, objtablecell, 2, "Merged Column(Age-Address)");


In this article, I showed a way of achieving how to merge cells in GridView. There can be many more ways of doing the same. I would love to receive suggestions for doing this in other ways.


  • 18th May, 2009: Initial post


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

You may also be interested in...

Comments and Discussions

QuestionCell Mergin I rows (not in header) Pin
ruwanc20034-Mar-13 0:29
memberruwanc20034-Mar-13 0:29 
QuestionHelped out a lot Pin
jgags12-Dec-12 6:31
memberjgags12-Dec-12 6:31 
QuestionHow to Merge columns in a Gridview if two cells have duplicate value then i want to merge it Pin
Member 451035830-Oct-10 16:34
memberMember 451035830-Oct-10 16:34 
Generalcell merging Pin
reza nazari2-Aug-10 21:45
memberreza nazari2-Aug-10 21:45 
General[My vote of 2] Contrast and Compare with a Repeater Pin
spoodygoon21-May-09 4:03
memberspoodygoon21-May-09 4:03 
Perhaps you could contrast and compare what you have done with a Repeater. I am of the opinion that a repeater is much better suited to work with tables that require merging of cells or more verbose formatting.

What I see here is a grid that will gather a great deal of view state and be more difficult to maintain that just straight forward html. However this is a good solution if you are dead set against using Repeaters and don't expect a large amount of rows. But I might not be seeing the big picture you are trying to present.
GeneralUseless Pin
Savara20-May-09 3:38
memberSavara20-May-09 3:38 
GeneralHi Niladri Pin
chirag.khatsuriya19-May-09 4:19
memberchirag.khatsuriya19-May-09 4:19 
GeneralRe: Hi Niladri Pin
Niladri_Biswas19-May-09 6:32
memberNiladri_Biswas19-May-09 6:32 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.180111.1 | Last Updated 18 May 2009
Article Copyright 2009 by Niladri_Biswas
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid