Javascript JQGRIDE错误-“；元素不是表“；

这看起来很简单，但我从jqGrid代码中得到了一个神秘的错误，它说“元素不是表”。代码如下：

var grid_data = [ {id:"1",invdate:"2007-10-01",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"1",invdate:"2010-05-24",name:"test",note:"note",tax:"10.00",total:"2111.00"} , {id:"2",invdate:"2010-05-25",name:"test2",note:"note2",tax:"20.00",total:"320.00"}, {id:"3",invdate:"2007-09-01",name:"test3",note:"note3",tax:"30.00",total:"430.00"}, {id:"4",invdate:"2007-10-04",name:"test",note:"note",tax:"10.00",total:"210.00"}, {id:"5",invdate:"2007-10-05",name:"test2",note:"note2",tax:"20.00",total:"320.00"}, {id:"6",invdate:"2007-09-06",name:"test3",note:"note3",tax:"30.00",total:"430.00"}, {id:"7",invdate:"2007-10-04",name:"test",note:"note",tax:"10.00",total:"210.00"}, {id:"8",invdate:"2007-10-03",name:"test2",note:"note2",amount:"300.00",tax:"21.00",total:"320.00"}, {id:"9",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"11",invdate:"2007-10-01",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"12",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"13",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"14",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"15",invdate:"2007-10-05",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"16",invdate:"2007-09-06",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"17",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"18",invdate:"2007-10-03",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"19",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"21",invdate:"2007-10-01",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"22",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"23",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"24",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"25",invdate:"2007-10-05",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"26",invdate:"2007-09-06",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"27",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"28",invdate:"2007-10-03",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"29",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}  ]; 
var default_grid = {
            datatype: "local", 
            height: 80, 
            rowNum: 10, 
            rowList: [10,20,30], 
            multiselect: true, 
            rowList:[10,20,30], 
            sortname: 'id', viewrecords: true, sortorder: "asc",
            footerrow: true,
            loadui: "block"
};
var grid_detail = $.extend({ 
    data: grid_data, 
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'], 
    colModel:[ 
        {name:'id',index:'id', width:60, sorttype:"int"}, {name:'invdate',index:'invdate', width:90, sorttype:"date", formatter:"date"},
        {name:'name',index:'name', width:100}, {name:'amount',index:'amount', width:80, align:"right",sorttype:"float", formatter:"number"}, 
        {name:'tax',index:'tax', width:80, align:"right",sorttype:"float"}, {name:'total',index:'total', width:80,align:"right",sorttype:"float"},
        {name:'note',index:'note', width:150, sortable:false}
    ],
    caption: "Test Grid" ,
    pager: '#plist2'
},default_grid);

$('#abutton').click(function(e){
    e.preventDefault();
    $('<div></div>').dialog().jqGrid(grid_detail);
});

var grid_data=[{id:“1”，invdate:“2007-10-01”，name:“test”，note:“note”，amount:“200.00”，tax:“10.00”，total:“210.00”}，{id:“1”，invdate:“2010-05-25”，name:“test2”，note2:“tax:“20.00”，total:“320.00”}，{id:“3”，invdate:“2007-09-01”，name:“test3”，note:“30.00”，总计：“430.00”}，{id:“4”，投资日期：“2007-10-04”，名称：“测试”，注：“注”，税：“10.00”，总计：“210.00”}，{id:“5”，投资日期：“2007-10-05”，名称：“测试2”，注：“注2”，税：“20.00”，总计：“320.00”}，{id:“6”，投资日期：“2007-09-06”，名称：“测试3”，注：“注：“注3”，税：“30.00”，总计：“430 id:“7”，日期：“2007-10-04”，名称：“测试”，注：“10.00”，注：“税：“总计：“10.00”210.00“，{id:“8”，投资日期：“2007-10-03”，名称：“test2”，注：“注2”，金额：“300.00”，税：“21.00”，合计：“320.00”}，{id:“9”，投资日期：“2007-09-01”，名称：“test3”，注：“注3”，金额：“400.00”，税：“30.00”，合计：“430.00”}，{id:“11”，投资日期：“2007-10-01”，名称：“测试”，注：“注：“注”，金额：“200.00”，税：“10.00”，合计：“210.00”{id:“12”，日期：“2007-10-02”注：“注2”，注：“注2”，金额：“300.00”，税额：“20.00”，合计：“320.00”}，{id:“13”，投资日期：“2007-09-01”，名称：“注3”，金额：“400.00”，税金：“30.00”，合计：“430.00”}，{id:“14”，投资日期：“2007-10-04”，名称：“试验”，注：“注”，金额：“200.00”，税金：“10.00”，合计：“210.00”}，{id:“15”，投资日期：“2007-10-05”，名称：“试验2”，注：“300.00”，税金：“20.00”“，总计：{id:'16'，投资日期：'2007-09-06'，名称：'test3'，注：'note3'，金额：'400.00'，税：'30.00'，总计：'430.00'，投资日期：'2007-10-04'，名称：'test'，注：'note'，金额：'200.00'，税：'10.00'，总计：'210.00'，注：{id:'18'，投资日期：'2007-10-03'，名称：'test2'，注：'note2金额：'300.00'，税：'20.00'，总计：'320.00'，税：'2007-09-01”，名称：“测试3”，注：“注3”，金额：“400.00”，税：“30.00”，总额：“430.00”}，{id:“21”，投资日期：“2007-10-01”，名称：“测试”，注：“注”，金额：“200.00”，税：“10.00”，总额：“210.00”}，{id:“22”，投资日期：“2007-10-02”，名称：“测试2”，注：“注：“注2”，金额：“300.00”，税：“20.00”，总额：“320.00”}，{id:“23”，投资日期：“2007-09-01”，名称：“测试3”，注：“注：“注3”，金额：“400.00”，税：“30.00”，总计：“430.00”}，{id:“24”，投资日期：“2007-10-04”，名称：“测试”，注：“注”，金额：“200.00”，税：“10.00”，总计：“210.00”}，{id:“25”，投资日期：“2007-10-05”，名称：“测试2”，注：“注2”，金额：“300.00”，税：“20.00”，总计：“320.00”}，{id:“26”，投资日期：“2007-09-06”，名称：“测试3”，注：“注：“注3”，金额：“400.00”，税：“30.00”，总计：“430 id:{27，{2007年10月04日，名称：“测试”，注：“注”，金额：“200.00”，税：“10.00”，总额：“210.00”}，{id:“28”，投资日期：“2007-10-03”，名称：“测试2”，注：“注2”，金额：“300.00”，税：“20.00”，总额：“320.00”}，{id:“29”，投资日期：“2007-09-01”，名称：“测试3”，注：“注3”，金额：“400.00”，税：“30.00”，总额：“430.00”}；
var默认网格={
数据类型：“本地”，
身高：80，
rowNum:10，
行列表：[10,20,30]，
多选：对，
行列表：[10,20,30]，
sortname:'id'，viewrecords:true，sortorder:'asc'，
是的，
loadui：“块”
};
var grid_detail=$.extend（{
数据：网格数据，
colname:['Inv No'，'Date'，'Client'，'Amount'，'Tax'，'Total'，'Notes'，]，
colModel:[
{名称：'id'，索引：'id'，宽度：60，排序类型：“int”}，{名称：'invdate'，索引：'invdate'，宽度：90，排序类型：“date”，格式化程序：“date”}，
{name:'name'，index:'name'，width:100}，{name:'amount'，index:'amount'，width:80，对齐：“right”，排序类型：“float”，格式化程序：“number”}，
{name:'tax'，index:'tax'，width:80，align:“right”，sorttype:“float”}，{name:'total'，index:'total'，width:80，align:“right”，sorttype:“float”}，
{名称：'note'，索引：'note'，宽度：150，可排序：false}
],
标题：“测试网格”，
寻呼机：“#plist2”
}，默认网格）；
$（'#abutton'）。单击（函数（e）{
e、 预防默认值（）；
$（''）.dialog（）.jqGrid（网格详细信息）；
});

这根本不是一条神秘的消息。元素不是表，这意味着您试图转换为网格的元素不是表。这很有意义：您使用的是div:

$('<div></div>')

编辑：要完全动态地执行此操作：

$('<div><table></table></div>').dialog().find('table:first').jqGrid(...);

$（“”）.dialog（）.find（'table:first'）.jqGrid（…）；

我现在明白了。之所以使用JS，是因为我正在工作的项目需要将发送到前端的数据制作成任意的jqGrids。因此，将其（div+table）转换成HTML仅用于测试是可以的。这么说，您可以如何动态地执行它？@Brandon Minton:您可以轻松地更改Milimetric建议的代码。”代码

var container=$（“body”），dlg=container.append（'Oleg，感谢您的帮助！这是非常有用的信息。在我的代码中，正如您所说的，表必须是唯一的，但是父容器元素如果不唯一似乎也无法工作。您也注意到了吗？
$('#myDialog').dialog();
$('#myGrid').jqGrid ...

$('<div><table></table></div>').dialog().find('table:first').jqGrid(...);