3

jqGrid v4.3.2
ie9
win7企业版

我正在使用以下代码生成子网格:

http://www.trirand.com/blog/jqgrid/jqgrid.html -> 高级 -> 网格作为子网格

我这样做,我有

1 级子网格OK
  2 级子网格OK
    3 级子网格OK
      4 级子网格它为 3rd Lvl sg 的每一行加载子网格 OK,但它只显示 3rd Lvl sg 的第一行 id 的数据

当我检查开发人员工具时,我看到请求总是发送第三个子网格的第一行的 id,我知道如何将自定义参数附加到我已经尝试过的 postData 以及 Oleg K postData for subgrid in jqgrid不工作?(这在我的情况下不起作用,数据未添加到请求中)

我试图从以下事件中返回 rowdid 但没有运气,它仍然返回第三个子网格的第一行 id,因此,对于第三个子网格上的每一行,子子网格总是返回相同的。

subGridRowExpanded  //always returns first row id of the third grid
onSelectRow  //doesn't fire if we click the + icon for expanding the subgrid
beforeSelectRow  //doesn't fire at all

另一个奇怪的行为是,如果我单击第三级子网格上的任何行,它只会选择第一行。

不,抱歉,不能使用 treegrid。

我正在考虑在第三级子网格的每一行的加号图标(第一个单元格)上绑定一个单击事件并触发一个 expandSubGridRow,但问题仍然存在,如何获取我单击的第三级的行的 rowid子网格

最好的问候和提前感谢,非常感谢任何帮助。

jQuery("#listsg11").jqGrid({
    url:'server.php?q=1',
    datatype: "xml",
    height: 190,
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
        {name:'id',index:'id', width:55},
        {name:'invdate',index:'invdate', width:90},
        {name:'name',index:'name', width:100},
        {name:'amount',index:'amount', width:80, align:"right"},
        {name:'tax',index:'tax', width:80, align:"right"},      
        {name:'total',index:'total', width:80,align:"right"},       
        {name:'note',index:'note', width:150, sortable:false}       
    ],
    rowNum:8,
    rowList:[8,10,20,30],
    sortname: 'id',
    viewrecords: true,
    sortorder: "desc",
    multiselect: false,
    subGrid: true,
    caption: "Grid as Subgrid",
    subGridRowExpanded: function(subgrid_id, row_id) {
        var subgrid_table_id;
        subgrid_table_id = subgrid_id+"_t";
        $("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' class='scroll'></table>");
        jQuery("#"+subgrid_table_id).jqGrid({
            url:"subgrid.php?q=2&id="+row_id,
            datatype: "xml",
            colNames: ['No','Item','Qty','Unit','Line Total'],
            colModel: [
                {name:"num",index:"num",width:80,key:true},
                {name:"item",index:"item",width:130},
                {name:"qty",index:"qty",width:70,align:"right"},
                {name:"unit",index:"unit",width:70,align:"right"},
                {name:"total",index:"total",width:70,align:"right",sortable:false}
            ],
            subGrid: true,
            caption: "Grid as Subgrid",
            subGridRowExpanded: function(subgrid_id2, row_id2) {
                var subgrid_table_id2;
                subgrid_table_id2 = subgrid_id2+"_t";
                $("#"+subgrid_id2).html("<table id='"+subgrid_table_id2+"' class='scroll'></table>");
                jQuery("#"+subgrid_table_id2).jqGrid({
                    url:"subgrid.php?q=3&id="+row_id2,
                    datatype: "xml",
                    colNames: ['No','Item','Qty','Unit','Line Total'],
                    colModel: [
                        {name:"num",index:"num",width:80,key:true},
                        {name:"item",index:"item",width:130},
                        {name:"qty",index:"qty",width:70,align:"right"},
                        {name:"unit",index:"unit",width:70,align:"right"},
                        {name:"total",index:"total",width:70,align:"right",sortable:false}
                ],
                subGrid: true,
                caption: "Grid as Subgrid",
                subGridRowExpanded: function(subgrid_id3, row_id3) {
                    var subgrid_table_id3;
                    subgrid_table_id3 = subgrid_id3+"_t";
                    $("#"+subgrid_id3).html("<table id='"+subgrid_table_id3+"' class='scroll'></table></div>");
                    jQuery("#"+subgrid_table_id3).jqGrid({
                        url:"subgrid.php?q=4&id="+row_id3,
                        datatype: "xml",
                        colNames: ['No','Item','Qty','Unit','Line Total'],
                        colModel: [
                            {name:"num",index:"num",width:80,key:true},
                            {name:"item",index:"item",width:130},
                            {name:"qty",index:"qty",width:70,align:"right"},
                            {name:"unit",index:"unit",width:70,align:"right"},
                            {name:"total",index:"total",width:70,align:"right",sortable:false}
                    ]
                    });
                }
                });
            }
        });
    }
});
4

1 回答 1

4

我仍然认为您在页面上显示的 *all** 子网格中的 *data 之间存在一些 id 冲突。例如,如果您从打开的网格中的某些级别插入具有“1”作为 rowid 的数据,则任何子网格中的任何其他数据都不应插入相同的子网格。

用于理解:您key:true用于所有级别的子网格上的"num"列。相应的值将不仅仅用于"num"网格单元内部的列(内部<td>here</td>)。它还将用作网格或子网格 ( )id的行的属性值。<tr>HTML 不允许页面上的 id 重复。因此,如果您插入带有 id 重复的元素,您可能会产生一些奇怪的效果,这些效果在不同的 Web 浏览器中可能会有所不同。例如,您将尝试选择一行,然后将选择另一行。作为行的选择,您还可能遇到更多难题。因此,您应该填充网格,以便id 在整个页面上是唯一的

为确保不存在 id 重复的问题,您可以使用idPrefixoption. 在 0 级,您可以使用

idPrefix: "m"

(从主要)例如。对于下一级的子网格,您可以使用

idPrefix: "s" + row_id + "_"

对于下一级子网格

idPrefix: "s" + row_id + "_" + row_id2 + "_"

idPrefix: "s" + row_id + "_" + row_id2 + "_" + row_id3 + "_"

的定义jQuery("#"+subgrid_table_id3)subGridRowExpanded所有先前级别的子网格中。所以你可以访问row_idrow_id2定义在外部范围。

我希望,在更改之后,您不会遇到任何奇怪的问题,例如您描述的问题。

这是重复的样本

单击以显示第四个网格时的第三个网格

于 2012-04-20T13:51:44.587 回答