首页新闻找找看学习计划

如何实现纵横向合并table

0
悬赏园豆:50 [已关闭问题] 关闭于 2017-12-20 17:04

横向合并:

航1 CA 退票时间限制1 变更时间限制1 变更时间限制2
航2 CZ 退票时间限制1
航3 Td 退票时间限制1s 退票时间限制2s 变更时间限制1s 变更时间限制2s
航3 Tf 退票时间限制1s 退票时间限制2s 变更时间限制1s 变更时间限制2
航3 TV 退票时间限制1s 退票时间限制2s 变更时间限制1s 变更时间限制2

纵向合并:

航1 CA 退票时间限制1 退票时间限制1 变更时间限制1 变更时间限制2
航2 CZ 退票时间限制1 退票时间限制1 退票时间限制1 退票时间限制1s
航3 Td 退票时间限制1s 退票时间限制2s 变更时间限制1s 变更时间限制2s
航3 Tf 退票时间限制1s 退票时间限制2s 变更时间限制1s 变更时间限制2
航3 TV 退票时间限制1s 退票时间限制2s 变更时间限制1s 变更时间限制2

如何动态实现纵横向合并talbe呢,C#,js都行

anywls的主页 anywls | 初学一级 | 园豆:2
提问于:2014-01-10 09:42
< >
分享
所有回答(7)
0
<td rowspan="" />

用这个

sinhbv | 园豆:2579 (老鸟四级) | 2014-01-10 09:49

动态实现

支持(0) 反对(0) anywls | 园豆:2 (初学一级) | 2014-01-10 09:52

@anywls: 用jq的话,遍历每一列,如果内容一样,就移除一个,并添加rowspan。用C#的话,先对要生成表格的数据进行检查,对需要合并的行进行标记,然后在生成表格。

支持(0) 反对(0) sinhbv | 园豆:2579 (老鸟四级) | 2014-01-10 09:58

@sinhbv: 单纯的横向或者纵向合并已经实现,问题是纵横向合并一起实现有问题,我想要的效果是这样

航1 CA 退票时间限制1 变更时间限制1 变更时间限制2
航2 CZ 退票时间限制1
航3 Td 退票时间限制1s 变更时间限制2s
Tf 变更时间限制2
TV 退票时间限制1s 退票时间限制2s 变更时间限制1s
支持(0) 反对(0) anywls | 园豆:2 (初学一级) | 2014-01-10 10:08

@anywls: 表格的数据结构是什么样的?

支持(0) 反对(0) sinhbv | 园豆:2579 (老鸟四级) | 2014-01-10 10:16

@sinhbv: sql数据,合并项为相同的字符串

支持(0) 反对(0) anywls | 园豆:2 (初学一级) | 2014-01-10 10:26

@anywls: 

public class MergeModel
    {
        public MergeModel()
        {
            ColMergeStart = this;
            RowMergeStart = this;
            ColSpan = false;
            RowSpan = false;
            ColNum = 1;
            RowNum = 1;
        }

        public bool ColSpan { get; set; }
        public bool RowSpan { get; set; }

        public int ColNum { get; set; }

        public int RowNum { get; set; }

        public MergeModel ColMergeStart { get; set; }

        public MergeModel RowMergeStart { get; set; }
    }

数据结构如上

而后

System.Data.DataTable dt=new System.Data.DataTable();
    System.Data.DataTable source=new System.Data.DataTable();//假设数据来源
    for (int i = 0; i < source.Columns.Count;i++)
    {
        dt.Columns.Add();
    }
    
    for(int i = 0;i<source.Rows.Count;i++)
    {
        var row = dt.NewRow();
        dt.Rows.Add(row);
        for(int j=0;j<source.Columns.Count;j++)
        {
            
            var mergeModel=new MergeModel();
            row[j] = mergeModel;
            string preview;
            string current = source.Rows[i][j].ToString();
            MergeModel previewMergeModel;
            if(j!=0)
            { 
                previewMergeModel = dt.Rows[i][j - 1] as MergeModel;                
                preview = source.Rows[i][j - 1].ToString();
                if(current==preview)
                {
                    mergeModel.ColSpan = true;
                    mergeModel.ColMergeStart = previewMergeModel.ColMergeStart;
                    mergeModel.ColMergeStart.ColNum++;
                }
            }
            if(i!=0)
            { 
                preview = source.Rows[i - 1][j].ToString();
                previewMergeModel = dt.Rows[i - 1][j] as MergeModel;
                if(current==preview)
                {
                    mergeModel.RowSpan = true;
                    mergeModel.RowMergeStart = previewMergeModel.RowMergeStart;
                    mergeModel.RowMergeStart.RowNum++;
                }
            }
        }
    }
然后遍历dt,后成table
支持(0) 反对(0) sinhbv | 园豆:2579 (老鸟四级) | 2014-01-10 11:01

@sinhbv: 

MergeModel previewMergeModel;
            if(j!=0)
            { 
                previewMergeModel = dt.Rows[i][j - 1] as MergeModel;                
                preview = source.Rows[i][j - 1].ToString();
                if(current==preview)
                {
                    mergeModel.ColSpan = true;
                    mergeModel.ColMergeStart = previewMergeModel.ColMergeStart;
                    mergeModel.ColMergeStart.ColNum++;
                }
            }

代码到这儿有问题previewMergeModel = dt.Rows[i][j - 1] as MergeModel;会返回null当current==preview时会报错

支持(0) 反对(0) anywls | 园豆:2 (初学一级) | 2014-01-10 16:36

@anywls: 第一个循环里改成

dt.Columns.Add(new System.Data.DataColumn(i.ToString(), typeof(MergeModel)));
支持(0) 反对(0) sinhbv | 园豆:2579 (老鸟四级) | 2014-01-10 22:15
0

//首行纵向重复合并
var tblen = $(".table tr").length;
for (var j = 0; j < tblen; j += 10) {
for (var i = 1; i <= 11; i++) {
var roomitem = $("#table" + j + " .room" + i);
$("#table" + j + " .room" + i + ":first").attr('rowspan', roomitem.length);
$("#table" + j + " .room" + i + ":first").attr('class', 'room');
$("#table" + j + " .room" + i).remove();
}
}

拾梦小侠ด้้้ | 园豆:748 (小虾三级) | 2014-01-10 15:14
0

可以建两个模版 一个横向一个纵向 显示一个隐藏一个 转换的时候 显示一个隐藏另一个

wolfy | 园豆:2636 (老鸟四级) | 2014-01-11 15:28

不大明白你的意思,麻烦相信说一下

支持(0) 反对(0) anywls | 园豆:2 (初学一级) | 2014-01-11 18:57

@anywls: 比如<div id="div1"><table><tr><td>表一</td></tr></table></div>

<div id="div2"><table><tr><td>表二</td></tr></table></div>

加载的时候 让div1显示 div2隐藏

如果转换则让div1隐藏 div2显示

支持(0) 反对(0) wolfy | 园豆:2636 (老鸟四级) | 2014-01-11 19:02
0

关注,学习中。。。

bitbug | 园豆:470 (菜鸟二级) | 2014-01-13 15:24
0

JS去控制他把

落幕残情 | 园豆:9 (初学一级) | 2014-01-13 16:08
0

页面展示上肯定用js合并比较好搞

隔壁王叔 | 园豆:4 (初学一级) | 2014-04-18 20:29
0

 用JS 就行很简单 colspan rowspan 就是表格的合并 是td的一项属性

开发网站  .NET或者java 这些后端语言

html  div  css  js  JQuery  这些都要会玩

流星霜紫 | 园豆:473 (菜鸟二级) | 2015-01-12 17:42
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册