jqGrid SubGrid没有填充

时间:2011-09-20 13:39:45

标签: jquery json jqgrid subgrid

我试图在不使用subgridurl的情况下使用json数据弹出子网格(因为这将调用每行扩展的页面)。但我得到错误:"t.rows is undefined"(在grid.base.js中)。代码如下: 使用的模块版本:

  1. jquery-1.6.2.js
  2. jqGrid 3.3.2
  3. 提前致谢。

            jQuery(gridID).jqGrid({
                url: dataURL,
                datatype: "json",
                colNames: ['ID', 'FirstName', 'LastName', 'Address1', 'Address2', 'City', 'Country'],
                colModel: [
                        { name: 'id', width: 200, sortable: false },
                        { name: 'firstName', width: 200, sortable: false, editable: true, edittype: 'select', editoptions: { value: { 1: '1', 2: '2', 3: '3'}} },
                        { name: 'lastName', width: 200, sortable: false, hidden: true },
                        { name: 'address1', width: 200, sortable: false, hidden: true },
                        { name: 'address1', width: 200, sortable: false, hidden: true },
                        { name: 'city', width: 200, sortable: false, hidden: false},
                        { name: 'country', width: 200, sortable: false, hidden: false}
                    ],
                rowNum: 10,
                rowList: [10, 20, 30],
                pager: '#pager2',
                sortname: 'id',
                viewrecords: true,
                sortorder: "desc",
                caption: "TEST",
                height: "400px",
                subGrid: true,
    
                subGridRowExpanded: function(subgrid_id, row_id) {
                    subGridID = subgrid_id;
                    jQuery("#" + subGridID).html("<div style='margin-left:415px'><table id='" + subGridID + "' class='scroll'><tr><td>Testing</td><td>Testing</td><td>Testing</td><td>Testing</td><td>Testing</td><td>Testing</td></tr></table></div>"); ;
                    jQuery("#" + subGridID).jqGrid(
           {
               datatype: function(pdata) { getDataSubGrid(pdata); },
               colNames: ['ID', 'FirstName', 'LastName', 'Address1', 'Address2', 'City', 'Country'],,
                colModel: [
                        { name: 'id', width: 200, sortable: false },
                        { name: 'firstName', width: 200, sortable: false, editable: true, edittype: 'select', editoptions: { value: { 1: '1', 2: '2', 3: '3'}} },
                        { name: 'lastName', width: 200, sortable: false, hidden: true },
                        { name: 'address1', width: 200, sortable: false, hidden: true },
                        { name: 'address1', width: 200, sortable: false, hidden: true },
                        { name: 'city', width: 200, sortable: false, hidden: false},
                        { name: 'country', width: 200, sortable: false, hidden: false}
                    ],
               height: 100,
               rowNum: 20,
    
               sortorder: "asc",
               height: '100%'
           });
                }
    
            });
    
            jQuery("#mygrid").jqGrid('#mygrid', '#pager2', { edit: false, add: false, del: false });
        }
    
    
        function getDataSubGrid(pData) {
            gridId = "#mygrid_t";
            $.ajax({
                type: 'GET',
                contentType: "application/json; charset=utf-8",
                url: myURL,//myurl would get json data from web service
                data: '{}',
                dataType: "json",
                success: function(data, textStatus) {
    
    
                    ReceivedClientDataForSubGrid(getMain(data).rows);
                },
                error: function(data, textStatus) {
                    alert('An error has occured retrieving data subgrid!');
                }
            });
        }
    
    
        function ReceivedClientDataForSubGrid(data) {
            var thegrid = $("#" + subGridID);
            if ($(thegrid).length == 0) alert('NOT EXISTS');
    
            thegrid.clearGridData();
            alert(data.length);//this shows 10 
            for (var i = 0; i < data.length; i++) {
            thegrid.addRowData(i + 1, data[i]);
            }
        }
    
    
        function getMain(dObj) {
            if (dObj.hasOwnProperty('d'))
                return dObj.d;
            else
                return dObj;
        }
    

1 个答案:

答案 0 :(得分:0)

错误“t.rows未定义”通常表示您对网格使用了错误的HTML片段。例如,如果您使用<div>代替<table>,则会出现错误。

此外,我严格建议您升级到当前的jqGrid版本4.1.2。今天jqGrid 3.3.2的使用特别是与jQuery相对较新的1.6.2版本一起使用可以解决问题。这就像尝试在新的汽车中使用30年前的汽油一样。你可能会遇到严重的问题。