jqGrid - 子网格重新加载，如果父网格页面更改？

我有一个简单的子网格作为网格实现和父网格有超过1页。jqGrid - 子网格重新加载，如果父网格页面更改？

以下是测试代码：

<!doctype html> 
<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="css/style.css"/> 
    <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.16.custom.css"/> 
    <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" /> 

    <script type="text/javascript" src="js/jquery.js"></script> 
    <script type="text/javascript" src="js/jquery-ui.js"></script> 
    <script type="text/javascript" src="js/grid.locale-en.js" ></script> 
    <script type="text/javascript" src="js/jquery.jqGrid.min.js" ></script>  
</head> 
<body> 
    <table id="grid1"> 
    <div id="pager1"></div> 
    </table> 

    <script type="text/javascript">  
     jQuery("#grid1").jqGrid({ 
     datatype: "local", 
     height: 250, 
     rowNum:5, 
     rowList:[5,10,15], 
     cellEdit:true, 
     cellsubmit: 'clientArray', 
     pager: '#pager1', 
     colNames:['Inv No', 'Client','Notes','Checked?' ], 
     colModel:[ 
     {name:'id',index:'id', width:60, sortable:false}, 
     {name:'name',index:'name', width:100, sortable:false}, 
     {name:'note',index:'note', width:150, sortable:false, editable:true}, 
     {name:'ind_checked',index:'ind_checked', width:100, sortable:false, align:'center', editable:true, 
      edittype:'checkbox', editoptions: { value:"Yes:No" }, formatter:'checkbox'} 
     ], 
     caption: "Testing", 
     loadonce: true, 
     subGrid : true, 
     subGridOptions: { reloadOnExpand : false}, 
     subGridRowExpanded: function(subgrid_id, parent_rowid) { 
      subgrid_table_id = subgrid_id+"_t"; 
      subgrid_pager_id = 'p_'+subgrid_table_id; 
      jQuery("#"+subgrid_id).html("<table id='"+subgrid_table_id+"'></table><div id='" + subgrid_pager_id + "'></div>"); 
      jQuery("#"+subgrid_table_id).jqGrid({ 
       datatype: "local", 
       height: "100%", 
       cellEdit:true, 
       cellsubmit: 'clientArray', 
       pager: '#'+subgrid_pager_id, 
       colNames:['Inv No','Item No', 'Qty'], 
       colModel:[ 
        {name:'id',index:'id', width:60, sortable:false}, 
        {name:'icode',index:'icode', width:60, sortable:false}, 
        {name:'qty',index:'qty', width:100, sortable:false, editable:true} 
       ], 
       loadonce: true, 
       loadComplete : function() { 
        var dataIds = $('#grid1').jqGrid('getDataIDs'); 
        var data = $('#grid1').jqGrid('getRowData',dataIds[parent_rowid-1]); 
        loadDetail(data.id); 
       } 
      }); 
     } 
     }).navGrid('#pager1'); 

     var mydata = [ 
     {id:"1",name:"test1",note:"note1",ind_checked:"yes"}, 
     {id:"2",name:"test2",note:"note2",ind_checked:"no"}, 
     {id:"3",name:"test3",note:"note3",ind_checked:"yes"}, 
     {id:"4",name:"test4",note:"note4",ind_checked:"yes"}, 
     {id:"5",name:"test5",note:"note5",ind_checked:"no"}, 
     {id:"6",name:"test6",note:"note6",ind_checked:"no"}, 
     {id:"7",name:"test7",note:"note7",ind_checked:"yes"}, 
     {id:"8",name:"test8",note:"note8",ind_checked:"no"}, 
     {id:"9",name:"test9",note:"note9",ind_checked:"no"} ] 
     ; 

     for(var i=0;i<mydata.length;i++) { 
      jQuery("#grid1").jqGrid('addRowData',i+1,mydata[i]); 
     } 

     var mySGdata = [ 
     {id:"1",icode:"item1",qty:10}, 
     {id:"1",icode:"item2",qty:10}, 
     {id:"3",icode:"item1",qty:10}, 
     {id:"3",icode:"item2",qty:10}, 
     {id:"3",icode:"item3",qty:10}, 
     {id:"4",icode:"item2",qty:10}, 
     {id:"7",icode:"item1",qty:10}, 
     {id:"7",icode:"item3",qty:10}, 
     {id:"9",icode:"item3",qty:10} ] 
     ; 

     function loadDetail(id) { 
      for (var i=0; i<mySGdata.length; i++) { 
       if (mySGdata[i].id==id) { 
        //alert('Add subgridRow'); 
        jQuery("#"+subgrid_table_id).jqGrid('addRowData',i+1,mySGdata[i]); 
       } 
      } 
     } 
    </script> 
</body> 
</html>

的问题是，如果家长电网改变了页面的子网格将刷新本地数据，甚至是我加的subGridOptions的选项：{reloadOnExpand：假}和loadonce：TURE

比方说，你可以在子网格更改数量，然后折叠和展开。子网格不会重新加载本地数据，并且仍然保留我的更改。

但是，如果我切换到下一页并切换回上一页，那么当我展开它时，子网格会重新加载本地数据。所以，我失去了所有的改变。

有没有人有任何想法和任何解决方法，或我失踪的东西？请建议我。谢谢。

为了测试我的脚本，请点击rowList，并使网格首先包含5行，并有2页，因为我不知道如何使页面/容器显示5行在本地的第一个开始数据。如果有人知道如何去做，那对我来说也是一种奖励。谢谢！

更新时间： 我想通了，它不仅是网页被更改，这也迫使亚格重装时，我改变rowList（多少行显示页）。有什么办法可以避免这种行为？请。谢谢

来源

2012-01-11 early

首先，我会首先创建数据数组，并将它们直接设置为网格选项（如this example）。然后行数是好的，没有额外的JavaScript代码加载是必需的。

否则，您必须将数据添加后，继续正确加载网格有行数：

jQuery("#grid1").trigger("reloadGrid");

也看到这个reload example。

为了您的主要问题：选项loadonce和寻呼机不一起工作（见this link）。

解决方法：我认为您必须在每次数据更改后或每次分页之前更改数据变量（例如，您可以使用onPaging -event）。

来源

2012-01-12 08:07:35 scessor

谢谢你纠正我。对于主要问题，由于我的实际网格通过xml获取数据，并且当用户单击“保存”时需要将所有更改保存在一个批处理中，因此更新对服务器的更改不能作为此处的选项。所以现在，我正在努力将更改加载到子网格loadComplete之后的子网格中。 – early 2012-01-12 17:19:14

，或者强制子网格从locol而不是从服务器加载我的更改，如果子网格已经“加载”，因为允许在运行时更改url和数据类型。 – early 2012-01-12 17:49:52

我终于解决了一个问题。这个概念是我设置了一个与parent_rowid对应的数组，当一个子网格展开时，然后将服务器中的数据存储在子网格loadComplete事件中，并将所有更改保存到此数组中。如果展开相同的子网格，我指示子网格从本地数组而不是服务器加载数据。 @scessor，谢谢你指导我一个方向。 – early 2012-01-12 20:12:04

jqGrid - 子网格重新加载，如果父网格页面更改？

回答

相关问题