子网格中的jqGrid冻结列

Question

我知道如果从http://www.trirand.com/jqgridwiki/doku.php?id=wiki:frozencolumns启用了子网格，则冻结列不起作用。

我的理解是冻结在父网格中不起作用但它应该在子网格中工作？

但是当我在子网格中尝试冻结列时，它不起作用？这是否意味着冻结列在父网格和子网格中都不起作用。

Answer 1

如果您使用subgrid as grid，那么jqGrid只会在“子网格行”中创建空<div>，其中可以放置任何信息。因此，您可以创建例如div中具有任何功能的新网格。您可以使用冻结的原因列创建网格。

我通过修改旧答案中的演示为您创建了the demo。结果如下所示

我使用CSS

标记了冻结列的标题

.ui-jqgrid .frozen-div .ui-th-column { background: #f0dcdd; color: black; }

子网格的代码如下

subGrid: true,
subGridRowExpanded: function (subgridId, rowid) {
    var $subgrid = $("<table id='" + subgridId + "_t'></table>");
    $subgrid.appendTo("#" + subgridId);
    $subgrid.jqGrid({
        datatype: "local",
        data: $(this).jqGrid("getLocalRow", rowid).files,
        colNames: ["Name", "Filetype", "col3", "col4"],
        colModel: [
            {name: "name", width: 130, key: true, frozen: true},
            {name: "filetype", width: 130, frozen: true},
            {name: "col3", width: 130},
            {name: "col4", width: 130}
        ],
        height: "100%",
        rowNum: 10,
        sortname: "name",
        shrinkToFit: false,
        autowidth: true,
        idPrefix: "s_" + rowid + "_"
    }).jqGrid("setFrozenColumns");
}

我使用shrinkToFit: false来防止子网格列的默认缩小以及设置子网格宽度的autowidth: true。

代码适用于我最近发布的jqGrid 3.7或免费的jqGrid 3.8（请参阅here和here），但如果使用更旧版本的jqGrid，则需要触发{{1 } event（见the answer）。