下面直接给你最实用、最专业的创建子网格（subgrid / 主从网格）方法，jQuery EasyUI 通过官方detailview扩展实现，点击主网格行左边的“+”号展开显示完整的子 datagrid（支持远程加载、编辑、复选框、分页等），复制粘贴就能用，领导最爱的“订单主表 + 商品明细子表”效果全都有！
前提：必须引入 detailview 扩展
在 jquery.easyui.min.js 之后添加：
<scriptsrc="https://www.jeasyui.com/easyui/datagrid-detailview.js"></script>（或从官网下载最新版）
方法1：最经典 - 主网格展开显示子网格（推荐现在就用这个，超级专业！）
<tableid="dg"class="easyui-datagrid"title="订单主表（展开显示订单明细子网格）"style="width:900px;height:500px"data-options="url:'get_orders.php', <!-- 主表数据接口 --> fitColumns:true, singleSelect:true, pagination:true, rownumbers:true, view: detailview, <!-- 关键：使用 detailview --> detailFormatter: function(index,row){ return'<div style=\"padding:10px\"><table class=\"subgrid\"></table></div>'; }, onExpandRow: function(index,row){ var subgrid = $(this).datagrid('getRowDetail',index).find('table.subgrid'); subgrid.datagrid({ url:'get_order_items.php?order_id='+row.id,<!-- 子表数据接口，根据主行ID加载 -->fitColumns:true, singleSelect:false, rownumbers:true, pagination:false, height:'auto', columns:[[ {field:'ck',checkbox:true}, {field:'product_id',title:'商品ID',width:80}, {field:'product_name',title:'商品名称',width:200}, {field:'price',title:'单价',width:100,align:'right'}, {field:'quantity',title:'数量',width:80,align:'center'}, {field:'subtotal',title:'小计',width:120,align:'right', formatter:function(v,r){return (r.price*r.quantity).toFixed(2);}} ]], onResize:function(){ $('#dg').datagrid('fixDetailRowHeight',index); }, onLoadSuccess:function(){ setTimeout(function(){ $('#dg').datagrid('fixDetailRowHeight',index); },0); } }); $('#dg').datagrid('fixDetailRowHeight',index); } "><thead><tr><thfield="id"width="80">订单ID</th><thfield="customer"width="150">客户</th><thfield="total"width="120"align="right">订单金额</th><thfield="date"width="120">下单日期</th><thfield="status"width="80">状态</th></tr></thead></table>效果：
- 主网格每行左边有“+”号，点击展开显示完整的子网格
- 子网格根据主行ID远程加载明细数据，支持复选框、列运算、行号等
- 高度自动适配，展开多个行互不影响，报表感爆棚！
方法2：子网格也支持行内编辑 + 保存（更高级）
在子网格 columns 里加 editor，在 onLoadSuccess 后绑定保存逻辑即可（结合之前行内编辑代码）。
方法3：嵌套子网格（子网格里再展开子子网格）
只需在子网格也加 view: detailview 和 onExpandRow 逻辑，就能实现三级、四级嵌套（官方有 Nested SubGrid demo）。
你现在直接复制方法1的代码，准备好两个接口（主表 + 子表明细），引入 detailview.js，刷新页面就能看到完美的主从子网格效果了！
结合之前的复选框 + 分页 + 行内编辑 + 页脚摘要 + 条件行颜色，你的订单管理系统已经可以直接上线了。
想要我给你一个完整的HTML示例（带本地模拟数据 + 子网格编辑 + 合计计算 + 多级嵌套）？
或者你告诉我你的主表/子表字段（比如“客户订单 + 商品明细”或“部门 + 员工”），我2分钟发你精准适配的代码，复制就能跑！
快说说你的具体场景，我手把手帮你搞定，5分钟内看到超级专业的子网格效果！
