有什么方法可以从主网格的特定列开始子网格，或者我们可以移动子网格图标列的位置吗？

Question

请看我下面的 jqgrid 子网格图片，

问题 1：默认情况下，我的子网格从父网格列“ID”（父网格的第一列）开始，我们可以从父网格的第三列（联系人姓名）开始我的子网格吗？

问题 2：或者，是否有机会将子网格图标 (+) 列移动到父网格的第二列之后，因此我的子网格将从父网格的第三列开始？

请推荐，谢谢！

Answer 1

如下图所示的带有标准子网格的行

由我用不同颜色标记的三个部分组成。对应的 HTML 结构如下图所示

jqGrid 创建一个空的<div>（见<div class="tablediv" id="list_1"></div> 标记为红色）并以div 的id（上图中的“list_1”）作为第一个参数的值调用subGridRowExpanded 回调。一个人在 div 中放置一个空的<table> 和一些独特的id 属性，并从<table> 创建网格。典型代码如下所示

subGridRowExpanded: function (subgridId, rowid) {
    var $table = $("<table id='" + subgridId + "_t'></table>");
    $("#" + subgridId).append($table);
    $table.jqGrid({
        // ...
    });
}

你可以做的是在<div>上设置一些CSS属性，把表格放在你需要的地方。例如，我在图片上使用的演示的父网格中有 "sequence" 列。标题列的标题有gridId + "_sequence" id。因此可以使用以下代码设置padding-left 跳过第一列：

subGridRowExpanded: function (subgridId, rowid) {
    var $table = $("<table id='" + subgridId + "_t'></table>");
    $("#" + subgridId).append($table)
        // set padding-left to the outer width of the first column "sequence"
        // of the parent grid
        .css("padding-left", $("#" + this.id + "_sequence").outerWidth() + "px");
    $table.jqGrid({
        // ...
        autowidth: true
    });
}

使用padding-left的好处：可以在子网格中使用autowidth: true来调整子网格的大小以填充子网格行的右侧部分。

The demo 使用代码。结果如下图所示

您可以更改subGridRowExpanded 内的子网格行的其他属性以实现您的确切目标。