Click here to Skip to main content

Article

How to Merge Cells with Equal Values in a GridView

Mykola Tarasyuk

Rate me:

4.87/5 (48 votes)

20 Mar 2009CPOL

270.8K

6.3K

98

63

My solution is not the first; however, I think, it is rather universal and very short - less than 20 lines of the code...

In this tip, you will learn a universal and short method to merge GridView rows if neighboring cells show equal values.

Download sample code - 3.3 KB

Introduction

There are a lot of methods on the Internet solving the problem of how to merge GridView rows if neighboring cells show equal values. My approach is not the first; however, I think, it is rather universal and very short - less than 20 lines of code.

The algorithm is simple: to bypass all the rows, starting from the second at the bottom, to the top. If a cell value is the same as a value in the previous (lower) row, then increase RowSpan and make the lower cell invisible, and so forth.

The code that merges the cells is very short:

C#

public class GridDecorator
{
    public static void MergeRows(GridView gridView)
    {
        for (int rowIndex = gridView.Rows.Count - 2; rowIndex >= 0; rowIndex--)
        {
            GridViewRow row = gridView.Rows[rowIndex];
            GridViewRow previousRow = gridView.Rows[rowIndex + 1];

            for (int i = 0; i < row.Cells.Count; i++)
            {
                if (row.Cells[i].Text == previousRow.Cells[i].Text)
                {
                    row.Cells[i].RowSpan = previousRow.Cells[i].RowSpan < 2 ? 2 : 
                                           previousRow.Cells[i].RowSpan + 1;
                    previousRow.Cells[i].Visible = false;
                }
            }
        }
    }
}

The last action is to add an OnPreRender event handler for the GridView:

C#

protected void gridView_PreRender(object sender, EventArgs e)
{
    GridDecorator.MergeRows(gridView);
}

History

20^th March, 2009: Initial version

License

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

Written By

Mykola Tarasyuk

Software Developer (Senior)

Ukraine

I'm a software developer from Ukraine. I write about ASP.NET and other .NET related topics over at my blog

Comments and Discussions

Re: merge cells in Windows Application Using WPF DataGrid.

Mykola Tarasyuk29-Sep-10 3:53

Mykola Tarasyuk

29-Sep-10 3:53

Sorry, I have never worked with WPF DataGrid. The above approach is based on HTML features and is not suitable for Windows controls.

Alternating Colors?

cas200019-May-09 5:04

19-May-09 5:04

First of all, great code!!

Is there a way to add alternating colors to each group?

Thanks.

Re: Alternating Colors?

Mykola Tarasyuk19-May-09 19:48

Mykola Tarasyuk

19-May-09 19:48

Hi,

You can do something similar to this (not tested):

if (row.Cells[i].Text == previousRow.Cells[i].Text)
{
       row.Cells[i].RowSpan = previousRow.Cells[i].RowSpan < 2 ? 2 : 
                                           previousRow.Cells[i].RowSpan + 1;
       row.Cells[0].BackColor = System.Drawing.Color.FromArgb(random.Next(int.MaxValue))
       previousRow.Cells[i].Visible = false;
}

where random is an instance of the Random class.

how can this be done for vs2003

iluvtorrent15-Apr-09 21:01

15-Apr-09 21:01

just wondering how can this be done for vs2003

thx

Re: how can this be done for vs2003

Mykola Tarasyuk16-Apr-09 8:20

Mykola Tarasyuk

16-Apr-09 8:20

Replace GridView gridView by DataGrid dataGrid and use dataGrid.Items instead of gridView.Rows. Everything else should work.

Re: how can this be done for vs2003

iluvtorrent16-Apr-09 22:06

16-Apr-09 22:06

many thanks. managed to get it to work.

keertiraj5559-Apr-09 3:30

9-Apr-09 3:30

i used the method in my application but i got a problem

Re: My vote of 1

Mykola Tarasyuk9-Apr-09 6:04

Mykola Tarasyuk

9-Apr-09 6:04

You gave negative ratings for 5 articles in 20 minutes.[^] It seems that you spend not much time investigating the problem. Have you tried it at all?

Re: My vote of 1

gstolarov9-Apr-09 18:45

9-Apr-09 18:45

I suspect he created more then 1 account - I saw other votes at the same time with the same syntax and grammatical errors from the accounts opened today. I also saw something similar happening before

I wish there would be a way to block those guys and remove their voting - they just discourage people who make an effort to share their knowledge.

By the way great article, elegant solutions - thumbs up and 5 from me!

Re: My vote of 1

Mykola Tarasyuk9-Apr-09 19:31

Mykola Tarasyuk

9-Apr-09 19:31

Thanks for the warm words about my work, the same I can say about yours.
Btw, I visited your site. Nice games!

Re: [SORRY] My vote of 1

keertiraj55511-Apr-09 0:09

11-Apr-09 0:09

I'm really sorry, i've made a big mistake. Rose | [Rose]

Rose | [Rose]

4 from me

gstolarov wrote:
I suspect he created more then 1 account - I saw other votes at the same time with the same syntax and grammatical errors from the accounts opened today. I also saw something similar happening before I wish there would be a way to block those guys and remove their voting - they just discourage people who make an effort to share their knowledge.By the way great article, elegant solutions - thumbs up and 5 from me!

Re: [SORRY] My vote of 1, now 4 from me

keertiraj55511-Apr-09 0:25

11-Apr-09 0:25

I'm really sorry, i've made a big mistake. Rose | [Rose]

Rose | [Rose]

4 from me

gstolarov wrote:
I suspect he created more then 1 account - I saw other votes at the same time with the same syntax and grammatical errors from the accounts opened today. I also saw something similar happening before I wish there would be a way to block those guys and remove their voting - they just discourage people who make an effort to share their knowledge.By the way great article, elegant solutions - thumbs up and 5 from me!

Re: My vote of 1

Shameel5-Jul-11 8:31

5-Jul-11 8:31

Do not give negative ratings without trying something and without elaborating on what the problem is. Can you take some pains to let us know what is the error that you got?

Gridview Grouping

danishjee30-Mar-09 21:54

30-Mar-09 21:54

Great work
you are grouping left to right but i want to make make up to down
here is my link example
http://forums.asp.net/p/1403574/3046200.aspx#3046200[^]

Re: Gridview Grouping [modified]

Mykola Tarasyuk31-Mar-09 0:38

Mykola Tarasyuk

31-Mar-09 0:38

Actually the above code does not group data, it only merges cells if they contain equal values. So if you manage to get data in this form

Sr#.   Item   Description      Weight   Color     Shape  Qty   Price
1      10002     ABC             2.0     Red       RJ     1     100
1      10002     ABC           21.02     Gray      KJ     1     100
2      10254     DEF             2.0     Green     A-J    2    2200
2      10254     DEF             2.9     White     L.S.   2    2200
2      10254     DEF            2.01     Melt      LO     2    2200

and execute GridDecorator.MergeRows(gridView) you will get something similar to the example you posted.

modified on Tuesday, March 31, 2009 7:01 AM

problem in the code

AboElmnzer26-Mar-09 3:16

26-Mar-09 3:16

first,this a very good idea

but when i use this method in my project there is a problem

* my grid view source is data table
DataTable dtfarmData = UsersUtil.GetUserFarmsData(conn, userId);
grdFarmlist.DataSource = dtfarmData;
grdFarmlist.DataBind();

* but the cell.text in the method == null???????
public static void MergeRows(GridView gridView)
{
for (int rowIndex = gridView.Rows.Count - 2; rowIndex >= 0; rowIndex--)
{

GridViewRow row = gridView.Rows[rowIndex];
GridViewRow previousRow = gridView.Rows[rowIndex + 1];

for (int cellIndex = 0; cellIndex < row.Cells.Count; cellIndex++)
{
if (row.Cells[cellIndex].Text == previousRow.Cells[cellIndex].Text)
{
row.Cells[cellIndex].RowSpan = previousRow.Cells[cellIndex].RowSpan < 2 ? 2 : previousRow.Cells[cellIndex].RowSpan + 1;
previousRow.Cells[cellIndex].Visible = false;
}
}
}
}

then the result in the grid view appear the first row only

Re: problem in the code

Mykola Tarasyuk26-Mar-09 9:28

Mykola Tarasyuk

26-Mar-09 9:28

Hi AboElmnzer,

As far as I know row.Cells[cellIndex].Text can't be null. Type of row.Cells[cellIndex] is the TableCell and its Text property, according to the .Net Reflector, is implemented in such way:

public virtual string Text
{
    get
    {
        object obj2 = this.ViewState["Text"];
        if (obj2 != null)
        {
            return (string) obj2;
        }
        return string.Empty;
    }
  .....

So there is no chance that it can be null. I tried to reproduce your situation but failed to do it Frown | :(

Frown | :(

. Perhaps I misundertood something, please explain in details. Anyway, you always can add an additional check in the condition, like this:

if (row.Cells[cellIndex].Text == previousRow.Cells[cellIndex].Text
     || (string.IsNullOrEmpty(row.Cells[cellIndex].Text) && string.IsNullOrEmpty(previousRow.Cells[cellIndex].Text)))
{
  ...

Kind regards,
Mykola

Re: problem in the code

akdn200929-Mar-09 19:03

29-Mar-09 19:03

Dear Brother,

It is a great solution, my scenario is different I want to apply it on one cell rather than all gridview cells

I do approcaite your quite response

Ahmad Khalid Asghari
website http://www.softwaredev.com.af

Re: problem in the code

Mykola Tarasyuk30-Mar-09 3:30

Mykola Tarasyuk

30-Mar-09 3:30

akdn2009 wrote:
I want to apply it on one cell rather than all gridview cells

I guess you meant how to merge cells in only one column. Try this:

public static void MergeRows(GridView gridView)
{
   //index of a column where cells should be merged
   int cellIndex = ...;

   for (int rowIndex = gridView.Rows.Count - 2; rowIndex >= 0; rowIndex--)
   {
        GridViewRow row = gridView.Rows[rowIndex];
        GridViewRow previousRow = gridView.Rows[rowIndex + 1];
       
        if (row.Cells[cellIndex].Text == previousRow.Cells[cellIndex].Text)
        {
            row.Cells[cellIndex].RowSpan = previousRow.Cells[cellIndex].RowSpan < 2 ? 2 : 
                                   previousRow.Cells[cellIndex].RowSpan + 1;
            previousRow.Cells[cellIndex].Visible = false;
        }
    }
}

Kind regards,
Mykola

Re: problem in the code [modified]

Scott Way20-Aug-09 7:36

20-Aug-09 7:36

I am getting the same issue. No matter how I slice it or which event handler I use on the grid view the text property is always empty and I end up with just the first row as this person has described.

modified on Thursday, August 20, 2009 1:51 PM

Re: problem in the code

Scott Way20-Aug-09 9:19

20-Aug-09 9:19

Okay here is what i was able to determine.... The GridDecorator does not appear to work when the autogeneratecolumns is turned off.

For example the code works perfectly with this grid:

<asp:GridView ID="sectionGrid" runat="server"
                  onprerender="sectionGrid_PreRender"
                  HeaderStyle-CssClass="columnHeader">
</asp:GridView>

But it does not work with this grid:

<asp:GridView ID="sectionGrid" runat="server"
                  onprerender="sectionGrid_PreRender"
                  AutoGenerateColumns="false"
                  HeaderStyle-CssClass="columnHeader">
                  <Columns>
                        <asp:HyperLinkField DataTextField="Section"
                                 DataNavigateUrlFormatString="SectionEdit.aspx?id={0}"
                                 DataNavigateUrlFields="SectionID" />
                        <asp:HyperLinkField DataTextField="Competency"
                                 DataNavigateUrlFormatString="CompetencyEdit.aspx?id={0}"
                                 DataNavigateUrlFields="CompetencyID" />
                  </Columns>
</asp:GridView>

Re: problem in the code

Mykola Tarasyuk20-Aug-09 9:59

Mykola Tarasyuk

20-Aug-09 9:59

I see the problem. It is not in AutoGenerateColumns property but in type of columns (HyperLinkField). If I use usual BoundField column it works.
I am not ready to suggest something right now, I need time to investigate it.

Re: problem in the code

Mykola Tarasyuk20-Aug-09 10:31

Mykola Tarasyuk

20-Aug-09 10:31

Something like this:

public class GridDecorator
{
    public static void MergeRows(GridView gridView)
    {
        for (int rowIndex = gridView.Rows.Count - 2; rowIndex >= 0; rowIndex--)
        {
            GridViewRow row = gridView.Rows[rowIndex];
            GridViewRow previousRow = gridView.Rows[rowIndex + 1];

            for (int cellIndex = 0; cellIndex < row.Cells.Count; cellIndex++)
            {
                string text1 = row.Cells[cellIndex] is DataControlFieldCell && ((DataControlFieldCell)row.Cells[cellIndex]).ContainingField is HyperLinkField
                    ? ((HyperLink)(row.Cells[cellIndex].Controls[0])).Text
                    : row.Cells[cellIndex].Text;

                string text2 = previousRow.Cells[cellIndex] is DataControlFieldCell && ((DataControlFieldCell)previousRow.Cells[cellIndex]).ContainingField is HyperLinkField
                    ? ((HyperLink)(previousRow.Cells[cellIndex].Controls[0])).Text
                    : previousRow.Cells[cellIndex].Text;

                if (text1 == text2)
                {
                    row.Cells[cellIndex].RowSpan = previousRow.Cells[cellIndex].RowSpan < 2 ? 2 : previousRow.Cells[cellIndex].RowSpan + 1;
                    previousRow.Cells[cellIndex].Visible = false;
                }
            }
        }
    }
}

Re: problem in the code

Scott Way21-Aug-09 6:05

21-Aug-09 6:05

I was able to get it to work by using the RowDataBound event. I added a hidden databound column (column 0).   I keyed off that colunn to determine when to merge my hyperlink field column (column 1).   This is kinda specfic to my needs, but you should be able to adapt it to more general use if you want.   I will give your new code a try when I have a chance. Either way your project was helpful to me.   Thanks - scott

            GridView grid = (GridView)sender;
            if (e.Row.RowIndex > 1)
            {
                  int x = e.Row.RowIndex - 1;
                  while ((x > 0) && (grid.Rows[x].Cells[1].Visible == false))
                  {
                        x--;
                  }
                  if (e.Row.Cells[0].Text == grid.Rows[x].Cells[0].Text)
                  {
                        if (grid.Rows[x].Cells[1].RowSpan < 2) grid.Rows[x].Cells[1].RowSpan = 2;
                        else grid.Rows[x].Cells[1].RowSpan++;
                        e.Row.Cells[1].Visible = false;
                  }
            }

Re: problem in the code

Scott Way21-Aug-09 6:17

21-Aug-09 6:17

Yes, the new version worked. Thanks - scott

General News Suggestion Question Bug Answer Joke Praise Rant Admin

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

Go to top