GridView合并单元格（多列）

2012-03-29 11:09:40 1k 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

GridView 合并单元格(多列)及特定条件的数据高亮显示实现效果图如下: 代码: Tim Demo 演示 GridView ID="GridView1" runat="server" onrowdatabound="GridView1_RowDataBound"> 后台: using System; us 阅读详情

不知道合并gridview单元格有没有好的方法，是多列的。
比如我有姓名、照片、性别、出生年月等多列信息，其中这四列都是要合并单元格的。现在的问题就是姓名不太可能重复，但是照片会出现这样一个问题，因为可以不上传照片，所以如果相邻的两条信息都没有上传照片的话，照片这一列就不好合并了。性别的问题更突出，比如相邻的两条信息都是男或者都是女，合并好像也比较复杂。请问有没有好一点的办法？
或者说使用telerik 的radgrid可以实现这个功能吗？



原始样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

A    P    M    XXXX    O1      O2      O3

A    P    M    XXXX    O4      O5      O6

A    P    M    XXXX    O7      O8      O9

B    P2   F    YYYY    10      11      12

B    P2   F    YYYY    13      14      15

B    P2   F    YYYY    16      17      18

需求样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

                       O1      O2      O3

A    P    M    XXXX    O4      O5      O6

                       O7      O8      O9

                       10      11      12

B    P2   F    YYYY    13      14      15

                       16      17      18

...全文

汇编语言与接口技术（第4版）清华大学出版社第2章 80*86微处理器课后题答案汇编语言与接口技术（第4版）清华大学出版社第2章 80*86微处理器课后题答案阅读详情

将星陨落天命难违

.NET社区 62,272 成员 668,968 内容

+ 关注 + 加入社区

切换为时间正序

将星陨落天命难违 2012-03-31

打赏
举报

[Quote=引用 20 楼的回复:]
拼Table吧
[/Quote]
请问拼Table什么思路？

yp19910928 2012-03-31

打赏
举报

拼Table吧

xie_yanke 2012-03-31

打赏
举报

<%@ Page Language="C#" %>

<script runat="server">

    private void Page_Load()

    {

        List<Test> list = new List<Test>();

        list.Add(new Test("a2", "b3", "c3"));

        list.Add(new Test("a1", "b1", "c1"));

        list.Add(new Test("a1", "b2", "c2"));

        list.Add(new Test("a1", "b21", "c21"));

        list.Add(new Test("a3", "b4", "c4"));

        list.Add(new Test("a3", "b41", "c41"));



        gridView.DataSource = list;

        gridView.DataBind();

    }



    private string t1 = string.Empty;

    private void gridView_RowDataBound(object sender, GridViewRowEventArgs e)

    {

        switch (e.Row.RowType)

        { 

            case DataControlRowType.DataRow:

                Test test = e.Row.DataItem as Test;

                if (t1 != test.a) t1 = string.Empty;

                

                List<Test> list = gridView.DataSource as List<Test>;

                int x = list.Where<Test>(delegate(Test obj) { return obj.a == test.a; }).Count();

                if (x > 1)

                {

                    if (t1 == string.Empty)

                    {

                        e.Row.Cells[0].Attributes.Add("rowspan", x.ToString());

                        t1 = test.a;

                    }

                    else {

                        e.Row.Cells.RemoveAt(0);

                    }

                }

                break;

        }

    }



    private class Test

    {

        private string _a;

        public string a { get { return _a; } set { _a = value; } }

        private string _b;

        public string b { get { return _b; } set { _b = value; } }

        private string _c;

        public string c { get { return _c; } set { _c = value; } }



        public Test(string A, string B, string C)

        { 

            _a = A;

            _b = B;

            _c = C;

        }

    } 

</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form runat="server">

<asp:GridView ID="gridView" runat="server" OnRowDataBound="gridView_RowDataBound">

</asp:GridView>

</form>

</body>

</html>

将星陨落天命难违 2012-03-30

打赏
举报

[Quote=引用 13 楼的回复:]
在合并的过程中，有一些列需做些特殊的处理，如你提到的照片的情况，没上传，是空或null，在代码中判断出来，合并处理。
[/Quote]
比如连续两个人都没上传照片，是不能合并到一起的

将星陨落天命难违 2012-03-30

打赏
举报

[Quote=引用 17 楼的回复:]

8楼不可以?
引用 12 楼的回复:
每个人包含的“其它列”的数目不一定是一样的

其他列数目不一定,你又不用合并那个其他列.可以不用管

引用 15 楼的回复:
比如连续两个人都没上传照片，是不能合并到一起的

没上传照片的话你是用录入数据时是用默认图片,还是空字符串录入,还是null
在合并的时候判断下就可以.
[/Quote]
数据库中照片是image类型的，如果不上传照片默认是null

SomethingJack 2012-03-30

打赏
举报

repeater多么好多么方便哎你说你````

happytonice 2012-03-30

打赏
举报

在合并的过程中，有一些列需做些特殊的处理，如你提到的照片的情况，没上传，是空或null，在代码中判断出来，合并处理。

将星陨落天命难违 2012-03-30

打赏
举报

每个人包含的“其它列”的数目不一定是一样的

将星陨落天命难违 2012-03-30

打赏
举报



原始样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

A    P    M  XXXX     O1      O2      O3

A    P    M  XXXX     O4      O5      O6

A    P    M  XXXX     O7      O8      O9

A    P    M  XXXX     10      11      12

---------------------------------------------

B    P2   F  YYYY     13      14      15

B    P2   F  YYYY     16      17      18

B    P2   F  YYYY     19      20      21

---------------------------------------------

C    P2   F  ZZZZ     22      23      24

C    P2   F  ZZZZ     25      26      27

C    P2   F  ZZZZ     28      29      30

C    P2   F  ZZZZ     31      32      33

C    P2   F  ZZZZ     34      35      36





需求样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

                     O1      O2      O3

A    P    M  XXXX    O4      O5      O6

                     O7      O8      O9

                     10      11      12

----------------------------------------------

                     13      14      15

B    P2   F  YYYY    16      17      18

                     19      20      21

----------------------------------------------

                     22      23      24

                     25      26      27

C    P2   F  ZZZZ    28      29      30

                     31      32      33

                     34      35      36

将星陨落天命难违 2012-03-30

打赏
举报

其他列的行数可能更多，例如



原始样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

A    P    M    XXXX     O1      O2      O3

A    P    M    XXXX     O4      O5      O6

A    P    M    XXXX     O7      O8      O9

A    P    M    XXXX     10      11      12

---------------------------------------------

B    P2   F    YYYY     13      14      15

B    P2   F    YYYY     16      17      18

B    P2   F    YYYY     19      20      21

---------------------------------------------

C    P2   F    ZZZZ     22      23      24

C    P2   F    ZZZZ 	25      26      27

C    P2   F    ZZZZ     28	29      30

C    P2   F    ZZZZ 	31      32      33

C    P2   F    ZZZZ     34	35      36





需求样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

                       O1      O2      O3

A    P    M    XXXX    O4      O5      O6

                       O7      O8      O9

                       10      11      12

----------------------------------------------

                       13      14      15

B    P2    F    YYYY   16      17      18

                       19      20      21

----------------------------------------------

                       22      23      24

                       25      26      27

C    P2    F    ZZZZ   28	29      30

                       31      32      33

                       34	35      36

因为允许不上传照片，所以可能会出现相邻两人都没照片的情况

huangwenquan123 2012-03-30

打赏
举报

8楼不可以?
[Quote=引用 12 楼的回复:]
每个人包含的“其它列”的数目不一定是一样的
[/Quote]
其他列数目不一定,你又不用合并那个其他列.可以不用管

[Quote=引用 15 楼的回复:]
比如连续两个人都没上传照片，是不能合并到一起的
[/Quote]
没上传照片的话你是用录入数据时是用默认图片,还是空字符串录入,还是null
在合并的时候判断下就可以.

beautiful_melody 2012-03-30

打赏
举报

100分就是认识回答的人多啊

huangwenquan123 2012-03-30

打赏
举报



    protected void Page_Load(object sender, EventArgs e)

    {

//...

        GridView1.DataSource = dt;

        GridView1.DataBind();

        GroupName(0);

        GroupName(1);

        GroupName(3);

        GroupSex();

    }

    public void GroupName(int col)

    {

        TableCell oldName = GridView1.Rows[0].Cells[col];

        for (int i = 1; i < GridView1.Rows.Count; i++)

        {

            TableCell Name = GridView1.Rows[i].Cells[col];

            if (oldName.Text == Name.Text)

            {

                Name.Visible = false;

                if (oldName.RowSpan == 0)

                {

                    oldName.RowSpan = 1;

                }

                oldName.RowSpan++;

                oldName.VerticalAlign = VerticalAlign.Middle;

            }

            else

            {

                oldName = Name;

            }

        }

    }

    public void GroupSex()

    {

        TableCell oldName = GridView1.Rows[0].Cells[0];

        TableCell oldSex = GridView1.Rows[0].Cells[2];

        for (int i = 1; i < GridView1.Rows.Count; i++)

        {

            TableCell Name = GridView1.Rows[i].Cells[0];

            TableCell Sex = GridView1.Rows[i].Cells[2];

            if (oldName.Text == Name.Text && oldSex.Text == Sex.Text)

            {

                Sex.Visible = false;

                if (oldSex.RowSpan == 0)

                {

                    oldSex.RowSpan = 1;

                }

                oldSex.RowSpan++;

                oldSex.VerticalAlign = VerticalAlign.Middle;

            }

            else

            {

                oldName = Name;

                oldSex = Sex;

            }

        }

    }

将星陨落天命难违 2012-03-30

打赏
举报

[Quote=引用 3 楼的回复:]
这样的页面最好用table来做，然后ajax去后台取数据这样的灵活性大一点。
[/Quote]
请问table如何做？另外效果请看5楼，比如可能性别这列相邻的两个都相同，但是也要分开合并

将星陨落天命难违 2012-03-30

打赏
举报



原始样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

A    P    M    XXXX    O1      O2      O3

A    P    M    XXXX    O4      O5      O6

A    P    M    XXXX    O7      O8      O9

B    P2   F    YYYY    10      11      12

B    P2   F    YYYY    13      14      15

B    P2   F    YYYY    16      17      18

C    P3   F    ZZZZ    19      20      21

C    P3   F    ZZZZ    22      23      24

C    P3   F    ZZZZ    25      26      27



需求样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

                       O1      O2      O3

A    P    M    XXXX    O4      O5      O6

                       O7      O8      O9

                       10      11      12

B    P2   F    YYYY    13      14      15

                       16      17      18

                       19      20      21

C    P3   F    ZZZZ    22      23      24

                       25      26      27

请忽略5楼！

将星陨落天命难违 2012-03-30

打赏
举报



原始样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

A    P    M    XXXX    O1      O2      O3

A    P    M    XXXX    O4      O5      O6

A    P    M    XXXX    O7      O8      O9

B    P2   F    YYYY    10      11      12

B    P2   F    YYYY    13      14      15

B    P2   F    YYYY    16      17      18

需求样式

姓名 照片 性别 出生年月 其它列1 其它列2 其它列3

                       O1      O2      O3

A    P    M    XXXX    O4      O5      O6

                       O7      O8      O9

                       10      11      12

B    P2   F    YYYY    13      14      15

                       16      17      18

                       19      20      21

C    P3   F    ZZZZ    22      23      24

                       25      26      27

愤怒的包子 2012-03-30

打赏
举报

一般都用Table 好操作

zhangdaowu5 2012-03-30

打赏
举报

这样的页面最好用table来做，然后ajax去后台取数据这样的灵活性大一点。

liang_24 2012-03-30

打赏
举报



/// <summary>

        /// 合并行（合并的列要用Label控件）

        /// </summary>

        /// <param name="gvw">需要合并的GridView</param>

        /// <param name="sCol">要合并的列（从0开始）</param>

        /// <param name="controlName">控件名称</param>

        public static void MergeRows(GridView gvw, int col, string controlName)

        {

            for (int rowIndex = gvw.Rows.Count - 2; rowIndex >= 0; rowIndex--)

            {

                GridViewRow row = gvw.Rows[rowIndex];



                GridViewRow previousRow = gvw.Rows[rowIndex + 1];



                Label row_lbl = row.Cells[col].FindControl(controlName) as Label;

                Label previousRow_lbl = previousRow.Cells[col].FindControl(controlName) as Label;



                if (row_lbl != null && previousRow_lbl != null)

                {

                    if (row_lbl.Text == previousRow_lbl.Text)

                    {

                        row.Cells[col].RowSpan = previousRow.Cells[col].RowSpan < 1 ? 2 : previousRow.Cells[col].RowSpan + 1;



                        previousRow.Cells[col].Visible = false;

                    }

                }

            }

        }



<asp:GridView ID="gvUVSourceDistributionStatistic" runat="server" AutoGenerateColumns="false" CssClass="tableBorder" 

        onmouseover="changeto()" onmouseout="changeback()" Width="98%" HorizontalAlign="Center">

        <Columns>

            <asp:TemplateField HeaderText="日期" ItemStyle-HorizontalAlign="Center" HeaderStyle-Height="30"

                ItemStyle-Height="25">

                <ItemTemplate>

                    <asp:Label ID="lblSearchDate" runat="server" Text='<%# Convert.ToDateTime(Eval("SearchDate")).ToString("yyyy-MM-dd") %>' />

                </ItemTemplate>

            </asp:TemplateField>

            <asp:BoundField HeaderText="访客来源" DataField="VisitorSource" ItemStyle-HorizontalAlign="Center"/>

        </Columns>    

    </asp:GridView>

调用MergeRows方法要在绑定GridView后调用，这样就能解决了。
不过我也有个疑问：为什么不用控件包着要合并的列的话，遍历GridView的每一行时会显示要合并的列的单元格的值是空，如果不为空就不需要用控件来包着了，知道为什么的，告诉一声，谢谢

你若安好便是晴天 2012-03-30

打赏
举报

各位大侠，讨论结果是怎样的，哪种方法实现比较简单呢？

GridView合并单元格（多列）

相关推荐