闫士佳的第一篇博客——subgrid

今天做后台时遇到dategrid下面还需要嵌套一个dategrid情况，在网上借鉴了很多人的博客，最终做出来样子是这样的
以下是body里面的代码

<table id="dg" style="width:700px;height:250px"
        url=""
        title="经销商管理"
        singleSelect="true" 
        fitColumns="true"
        rownumbers="true"   
        fitColumns="true"   
        fit="true"          
        nowrap="false"
        striped="true"
        singleSelect="true"
        >    
    <thead>
        <tr>     
            <th field="sellername" align=left" width="100">经销商名称</th>
            <th field="contacts" align="left" width="100">联系人</th>
            <th field="tel" align="left" width="100">联系方式</th>
        </tr>
    </thead>
</table>

以下是javascript里面代码

<script type="text/javascript" src="http://www.jeasyui.com/easyui/datagrid-detailview.js"></script>
//主体信息表格    
    <script  type="text/javascript">
    $(function(){  
        $('#dg').datagrid({
            view: detailview,
            detailFormatter:function(index,row){
                return '<div style="padding:2px"><table class="ddv"></table></div>';
            },
            onExpandRow: function(index,row){   
                 var ddv = $(this).datagrid('getRowDetail',index).find('table.ddv');
                 ddv.datagrid({                
                    url:'',  //     
                    fitColumns:true,
                    singleSelect:true,
                    rownumbers:true,
                    loadMsg:'加载中...',
                    height:'auto',
                    columns:[[
                        {field:'categoryname',title:'授权代理品规',width:100},
                        {field:'district',title:'授权经营范围',width:100},
                        {field:'cutofftime',title:'授权截止日期',width:100}
                    ]],
                    onResize:function(){
                        $('#dg').datagrid('fixDetailRowHeight',index);
                    },
                    onLoadSuccess:function(){
                        setTimeout(function(){
                            $('#dg').datagrid('fixDetailRowHeight',index);
                        },0);
                    }
                });
                $('#dg').datagrid('fixDetailRowHeight',index);
            }
        });
    })
    </script>

下面是官网地址，没看懂的朋友可以去官网看看
http://www.jeasyui.com/tutorial/datagrid/datagrid22.php