jQuery 如何在 jqGrid 4.0 中合并单元格

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5625325/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 19:32:17  来源:igfitidea点击:

How to merge cells in jqGrid 4.0

jqueryjqgrid

提问by fairidox

I've been trying to "merge" cells in a jqGrid, that is, I want to make cells for specific rows have a colspan=2 (or more). So far I've been able to get the borders to work properly using the cellattroption in the column model with something like this:

我一直在尝试在 jqGrid 中“合并”单元格,也就是说,我想让特定行的单元格具有 colspan=2(或更多)。到目前为止,我已经能够使用列模型中的cellattr选项使边框正常工作,如下所示:

colModel = { name: "a", width=50, 
             cellattr: function(rowId, tv, rawObject, cm, rdata) {
                          if (rowId < 5) { return 'sytle="border-right:0px"'; } },

             name: "b", width=50, 
             cellattr: function(rowId, tv, rawObject, cm, rdata) {
                          if (rowId < 5) { return 'sytle="border-left:0px"'; } } };

This just removes the border for the cells that I want to merge (a & b up to line 5). But if I add text to any of these boxes text-align will obviously not work properly and the text just gets cut off if it is larger than 50 pixels.

这只是删除了我想要合并的单元格的边框(a & b 直到第 5 行)。但是,如果我向这些框中的任何一个添加文本,则 text-align 显然无法正常工作,并且如果文本大于 50 像素,则会被截断。

I could do some crazy thing where I do center-align by cutting all the text in half and add each half to column "a" and "b" under right-align and left-align respectively. However, there seems like there should be a better way.

我可以做一些疯狂的事情,通过将所有文本切成两半并将每一半分别添加到右对齐和左对齐下的“a”和“b”列来进行居中对齐。但是,似乎应该有更好的方法。

回答by Oleg

I find your question very interesting, so +1 from me.

我觉得你的问题很有趣,所以从我这里+1。

It seems to me that the usage of colspan=2is what you really need. To have the same number of the columns in the rows having colspan=2I suggest to hide the next <td>element in the row:

在我看来,使用的colspan=2是你真正需要的。要在行中具有相同数量的列,colspan=2我建议隐藏行中的下一个<td>元素:

{
    name:'a',index:'a', width:50,
    cellattr: function(rowId, tv, rawObject, cm, rdata) {
        if (Number(rowId) < 5) { return ' colspan=2' }
    }
},
{
    name:'b',index:'b', width:50,
    cellattr: function(rowId, tv, rawObject, cm, rdata) {
        if (Number(rowId) < 5) { return ' style="display:none;"' }
    }
}

I tested the implementation only a few time, but it seems to work:

我只测试了几次实现,但它似乎有效:

enter image description here

在此处输入图片说明

The demo you can see live here.

你可以在这里看到现场演示。

UPDATED: Another answershows how can be used rowspanattribute in jqGrid.

更新另一个答案显示了如何rowspan在 jqGrid 中使用属性。

回答by Milimetric

Sounds like it's not supported right now. They say "near future".

听起来现在不支持它。他们说“不久的将来”。

http://www.trirand.net/forum/default.aspx?g=posts&t=1184

http://www.trirand.net/forum/default.aspx?g=posts&t=1184