In this example i am going to describe how to Merge GridView Cells Or Columns In Gridview Rows Using C# and VB.NET in ASP.NET Containing Same Data or content. For this i m using DataBound Event of gridview, counting total rows and then checking each cells value against value of same cell in previous row and then setting the RowSpan of cells.
For this i have created a table containing Counties ,states and respective cities and country and state cells / columns are merged in rows having same country or states.
For knowing how to merge Gridview headers read article below
Merging GridView Header Columns or multiple Headers
You would also like to read
Hide GridView Columns In Normal Mode and Visible In Edit
Running Total In Gridview Footer in ASP.NET C# VB.NET
Html source of the page look like this
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BorderStyle="None" BorderWidth="1px" CellPadding="4" GridLines="Horizontal" ForeColor="Black" Height="119px" DataSourceID="SqlDataSource1" OnDataBound="GridView1_DataBound1"> <Columns> <asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" /> <asp:BoundField DataField="State" HeaderText="State" SortExpression="State" /> <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" /> </Columns> </asp:GridView> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="SELECT [Country], [State], [City] FROM [Details] ORDER BY [State]"> </asp:SqlDataSource>
C# code behind
01
protected
void
GridView1_DataBound1(
object
sender, EventArgs e)
02
{
03
for
(
int
rowIndex = GridView1.Rows.Count - 2;
04
rowIndex >= 0; rowIndex--)
05
{
06
GridViewRow gvRow = GridView1.Rows[rowIndex];
07
GridViewRow gvPreviousRow = GridView1.Rows[rowIndex + 1];
08
for
(
int
cellCount = 0; cellCount < gvRow.Cells.Count;
09
cellCount++)
10
{
11
if
(gvRow.Cells[cellCount].Text ==
12
gvPreviousRow.Cells[cellCount].Text)
13
{
14
if
(gvPreviousRow.Cells[cellCount].RowSpan < 2)
15
{
16
gvRow.Cells[cellCount].RowSpan = 2;
17
}
18
else
19
{
20
gvRow.Cells[cellCount].RowSpan =
21
gvPreviousRow.Cells[cellCount].RowSpan + 1;
22
}
23
gvPreviousRow.Cells[cellCount].Visible =
false
;
24
}
25
}
26
}
27
}
VB.NET code behind
01
Protected
Sub
GridView1_DataBound1
02
(
ByVal
sender
As
Object
,
ByVal
e
As
EventArgs)
03
04
For
rowIndex
As
Integer
= GridView1.Rows.Count - 2
To
0
Step
-1
05
Dim
gvRow
As
GridViewRow = GridView1.Rows(rowIndex)
06
Dim
gvPreviousRow
As
GridViewRow = GridView1.Rows(rowIndex + 1)
07
For
cellCount
As
Integer
= 0
To
gvRow.Cells.Count - 1
08
If
gvRow.Cells(cellCount).Text =
09
gvPreviousRow.Cells(cellCount).Text
Then
10
If
gvPreviousRow.Cells(cellCount).RowSpan < 2
Then
11
gvRow.Cells(cellCount).RowSpan = 2
12
Else
13
gvRow.Cells(cellCount).RowSpan =
14
gvPreviousRow.Cells(cellCount).RowSpan + 1
15
End
If
16
gvPreviousRow.Cells(cellCount).Visible =
False
17
End
If
18
Next
19
Next
20
End
Sub
If you like this post than join us or share
25 comments:
This comment has been removed by a blog administrator.
working thanks
hi good
how to Alternate Color on the first column?
Really a nice Post..
But the thing is i m not able to understand this blog.. can u help in that.
can u tell the basic logic which u used in databound
GREAT work!
Just copyed + pasted and it worked!
thanks a lot!!!
Could u add a check box to each cell and post the code.Help would be really appreciated!
In my case,i've got same value in the "State" column, and it has been merged. But i do not want it to be merge, cos my "Country" value is different. Any help for this?
Thank you!
One think I will suggest is to get the gridview from sender, this way, it is generic and can be used to any GridView.
protected void GridView1_DataBound1(object sender, EventArgs e)
{
{
GridView gv = (GridView)sender;
if (gv != null)
{
// whole code base of yours
}
}
Nice idea. I tried it and it worked but really slow. Looked at code for few minutes and realized that there is no need to place the code in Grid DataRowBound. Just place it in a function and call it after Grid.DataBind().
Cheers.
Similarly how to merge columns in a Gridview when both the cells are equal
eg:Mango Mango Mango Apple Banana
o/p: Mango Apple Banana
Similarly how to merge columns in gridview
when both the cells in a row are equal.
Hi,
I used the same code.Its works for me.Thanks a lot for that.
However I have a problem, i want to use different color for the different row, like in the above example for the Country India - I want to have different color for MH and UP. Right now its coming in the same color.
Please help if i am missing something here.
Thanks a lot in advance.
Hi,
How to sort the values in the above gridview.
I want to apply sorting on all the columns of the above girdview.
Thanks
hi, though the code is same its not working for me. please suggest some remedy.
@Above : What error you are getting ?
Have you download the source code and tried ?
Hi Guys,
Nice Work there. Your Code worked like a charm to me. What I want now as an addition to this is... I want to add a Serial No. Column which corresponds to say Country Column in your Example.
When Im Using this
<%# ((GridViewRow)Container).RowIndex + 1%>
It Generates the Sl no for all Un Merged rows. But I want it for the first Merged Rows... Any help???
-Srikanth Chaganti
Hi,
Thanks, your code is really helpful..worked fine.
Thanks
Hi,
This is really help ful. But it works only with BoundField only like
But it doesn't work with TempleteField
Can anybody help in this...
Thanks
worked............
Thanks! it is very useful!
nice
Hi, very thanks :)
SUPERB. Works very well.
Hi. i want to merge cells (using columnspan) that contain the same data horizontally. Can anybody help in this?
Post a Comment