如何使用JqGrid子網格進行內聯編輯？

Question

我知道如何使用主網格進行內聯編輯，但是有沒有辦法爲子網格執行？

這裏是我的JS文件：

$(function(){ 
    var lastsel; 
$("#list").jqGrid({ 
url:'example.php', 
postData:{q:1}, 
datatype: 'json', 
mtype: 'GET', 
colNames:['Anchor','Description','Email','Url','In Today','Out Today','In Total','Out Total','Credits','Ratio','Status'], 
colModel :[ 
    {name : 'anchor' , index : 'anchor', width : 55, 'editable':true, 'editoptions':{'size':30}}, 
    {'name' : 'description' , 'index' : 'description', 'width' : 55, 'editable':true, 'edittype':'textarea', 'editoptions':{'rows':'3','cols':'30'}}, 
    {'name' : 'email' , 'index' : 'email', 'width' : 55, 'editable':true, 'editoptions':{'size':30}}, 
    {'name' : 'url' , 'index' : 'url', 'width' : 55, 'editable':true, 'editoptions':{'size':30}}, 
    {'name' : 'in_today' , 'index' : 'in_today', 'width' : 55, 'align' : 'right'}, 
    {'name' : 'out_today' , 'index' : 'out_today', 'width' : 55, 'align' : 'right'}, 
    {'name' : 'in_total' , 'index' : 'in_total', 'width' : 55, 'align' : 'right'}, 
    {'name' : 'out_total' , 'index' : 'out_total', 'width' : 55, 'align' : 'right'}, 
    {'name' : 'credits' , 'index' : 'credits', 'width' : 55, 'align' : 'right', 'editable':true, 'editoptions':{'size':30}}, 
    {'name' : 'ratio' , 'index' : 'ratio', 'width' : 55, 'align' : 'right', 'editable':true, 'editoptions':{'size':30}}, 
    {'name' : 'status' , 'index' : 'status', 'width' : 55,'align' : 'center', 'editable':true, 'edittype':'checkbox', 'editoptions':{'value':"On:Off"}} 
], 
pager: '#pager', 
rowNum:10, 
rowList:[10,20,30], 
sortname: 'anchor', 
sortorder: 'desc', 
viewrecords: true, 
caption: 'My first grid', 
subGrid: true, 
subGridUrl: 'example.php?q=2', 
subGridModel: [{ name : ['Game','URL'],width : [200,300] }], 
onSelectRow: function(id){ 
    if(id && id!=lastsel){ 
     jQuery('#list').jqGrid('restoreRow',lastsel); 
     jQuery('#list').jqGrid('editRow',id, true, '', '', '', {'q':3,'oper':'trades-edit'}); 
     lastsel=id; 
    } 
}, 
editurl: "example.php" 

}); 
}); 

Answer 1

您可以使用網子網格爲網格選項在jqGrid的維基這裏詳述：

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:subgrid_as_grid

我用這個上目前的項目，它運作良好。優點是你可以使用任何網格功能，因爲子網格只是另一個網格。所以你不需要任何的子網格樣式選項。相反，你會有這樣的事情：

subGrid: true, 
    subGridRowExpanded: function(subgrid_id, row_id) { 
    // we pass two parameters 
    // subgrid_id is a id of the div tag created within a table 
    // the row_id is the id of the row 
    // If we want to pass additional parameters to the url we can use 
    // the method getRowData(row_id) - which returns associative array in type name-value 
    // here we can easy construct the following 
     var subgrid_table_id; 
     subgrid_table_id = subgrid_id+"_t"; 
     jQuery("#"+subgrid_table_id).jqGrid({ 
      url:"subgrid.php?q=2&id="+row_id, 
      datatype: "json", 
      colNames: ['Game','Url'], 
      colModel: [ 
      {name:"game",index:"num",width:80,key:true}, 
      {name:"url",index:"item",width:130}, 
      ], 
      height: 100%, 
      rowNum:20, 
      sortname: 'num', 
      sortorder: "asc" 
     }); 
    } 
    }); 

Answer 2

埃德吉布斯是在上面的正確軌道上。誠然，當你創建網格作爲子網格時，你可以訪問常規網格上的所有選項。在子網格中定義這兩個選項至關重要。省略這些選項將不允許您執行內聯編輯。

subGridRowExpanded: function(subgrid_id, row_id) { 
     ... 
     cellEdit: true, 
     cellsubmit: 'clientarray' 
     ... 
     .. 
    });