来自与主网格相同数据的子网格

Posted 2023-05-09

【中文标题】来自与主网格相同数据的子网格

【英文标题】：Sub grid from same data as main grid

【发布时间】：2013-03-02 19:18:50

【问题描述】：

我通过 json（来自 mysql）加载我的主网格数据。

我的网格由订单组成。每个订单包含许多项目（订单行）。

我想在加载时在一个查询中查询所有订单行。这些订单行应按订单 ID 分组。

这就是我想要的： 主网格：每个 id 只显示一行（子行中的值总计） 子网格：每个主行上都有一个“+”。当我单击它时，会出现子网格，显示每个子行

jqGrid 可以做到这一点吗？还是我必须对子网格进行额外查询？

最好的问候 奥莱

【问题讨论】：

需要显示多少个订单？订单数量是100左右，1000左右，10000左右还是更多？哪个网络浏览器（以及哪个版本）是您需要支持的主要网络浏览器。如果订单数量不是很大，可以在客户端做最多的工作，并从服务器一次返回所有订单。

大约100个订单。每个都有大约 1-10 个订单行。我的主要浏览器是 Chrome（最新）。我想在客户端做：加载所有数据并将数据分布在主网格和子网格中

【参考方案1】：

如果您需要显示大约 100 个订单，尤其是如果您使用带有快速 javascript 的 Chrome 等现代网络浏览器，您可以在客户端完成所有工作。服务器应该只提供按 id 排序的所有数据。您可以使用loadonce: true 一次加载所有日期。

我建议您仔细阅读the answer，这是基于之前答案（this one 和another one）的想法。我认为它可以解决您的问题。

【讨论】：

感谢您的回答。我会调查的。现在我将使用两个不同的查询。这对我也不起作用！！！请在此处查看我的其他帖子：***.com/questions/15435025/…

【参考方案2】：

<script type="text/javascript">
jQuery(document).ready(function() 
jQuery("#list").jqGrid(
url:'example.php',
datatype: 'xml',
mtype: 'GET',
colNames:['Inv No','Date', 'Amount','Tax','Total','Notes'],
colModel :[ 
  name:'invid', index:'invid', width:55, 
  name:'invdate', index:'invdate', width:90, 
  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 
],
pager: '#pager',
rowNum:10,
rowList:[10,20,30],
sortname: 'invid',
sortorder: 'desc',
viewrecords: true,
caption: 'My first 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_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','Total'],
      colModel: [
        name:"num",index:"num",width:80,key:true,
        name:"item",index:"item",width:130,
        name:"qty",index:"qty",width:80,align:"right",
        name:"unit",index:"unit",width:80,align:"right",           
        name:"total",index:"total",width:100,align:"right",sortable:false
      ],
      height: '100%',
      rowNum:20,
      sortname: 'num',
      sortorder: "asc"
   );
    
  ); 
); 
</script>

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

【讨论】：

这使用了 2 个不同的数据库查询，对吧？ ('example.php' 和 'subgrid.php')