jqgrid中的多级头UI问题

Question

我的jqgrid实现工作正常。但是在多级标题的情况下会出现轻微的UI问题。

如何解决此问题。我正在使用免费的jqgrid。

Answer 1

我个人很难在这样的多级标题中找到信息。我没有看到在“level2”文本上添加空闲空间有任何好处，但一般来说，你可以通过titleText中的空字符串来实现这一点。

The demo会显示如下图所示的结果

它使用代码

.jqGrid("setGroupHeaders", {
    useColSpanStyle: true,
    groupHeaders: [
        { startColumnName: "invdate", numberOfColumns: 1, titleText: "level1" },
        { startColumnName: "amount", numberOfColumns: 2, titleText: "level1" },
        { startColumnName: "note", numberOfColumns: 1, titleText: "level1" }
    ]
})
.jqGrid("setGroupHeaders", {
    useColSpanStyle: true,
    groupHeaders: [
        { startColumnName: "invdate", numberOfColumns: 1, titleText: "level2" },
        { startColumnName: "amount", numberOfColumns: 1, titleText: "" },
        { startColumnName: "tax", numberOfColumns: 1, titleText: "" },
        { startColumnName: "note", numberOfColumns: 1, titleText: "" }
    ]
})
.jqGrid("setGroupHeaders", {
    useColSpanStyle: true,
    groupHeaders: [
        { startColumnName: "amount", numberOfColumns: 1, titleText: "level2" },
        { startColumnName: "tax", numberOfColumns: 1, titleText: "level2" }
    ]
});