easyui中datagrid的多层嵌套高度自适应

2019独角兽企业重金招聘Python工程师标准>>>

function contractInfoInit(shopSysNo){
    $('#dg').datagrid({//爷爷级列表
        url:"../shopController/searchSignInfoByShopSysNo.do?shopSysNo="+shopSysNo,
        fitColumns:true,
        singleSelect:true,
        autoRowHeight:true,
        columns: [[{
                    field : 'shopNo', 
                    title : '商户号<br/>商户注册名称', 
                    width : 200, 
                    align : 'left',
                    formatter:function(value,r){
                        var content = "<a href='javascript:showSignDetail("+r.signSysNo+")'>"+
                        ifNull(r.bmShop.shopNo)+"</br>"+r.bmShop.shopRegName+"</a>"
                        return content;
                    }
                },{
                    field: 'signStatus',
                    title: '合同状态',
                    width: 150,
                    formatter: function(value, r) {
                        return getSignStatus(r.signStatus);
                    }
                }
            ]],
        pagination: true,
        view: detailview,  
        detailFormatter:function(index,row){  
            return '<div style="padding:2px"><table class="ddv"></table></div>'; 
        },  
        onExpandRow: function(index,row){//父亲级列表，注意此时行索引为index                                  
            var ddv = $(this).datagrid('getRowDetail',index).find('table.ddv');
            ddv.datagrid({
                url:"../shopController/searchBranchInfoBySignSysNo.do?signSysNo="+row.signSysNo,
                fitColumns:true,
                singleSelect:true,
                loadMsg:'',
                //height:'auto',
                autoRowHeight:true,
                columns:[[{
                            field:'branchName',
                            title:'网点中文名称',
                            width:100,
                            formatter: function(value, r){
                                return ifNull(r.branchName);
                            }
                        },,{
                            field:'terminalNum',
                            title:'终端台数',
                            width:100,
                            formatter: function(value ,r){
                                return ifNull(r.terminalNum);
                            }
                        }
                ]],
                view: detailview,  
                detailFormatter:function(index,r){  
                    return '<div style="padding:2px"><table class="dddv"></table></div>';  
                },  
                onExpandRow: function(index1,r){//子列表，此时行索引为index1
                    var dddv = $(this).datagrid('getRowDetail',index1).find('table.dddv');
                    dddv.datagrid({
                        url:"../shopController/searchTerminalInfoByBranchSysNo.do?branchSysNo="+r.branchSysNo,
                        fitColumns:true,
                        nowrap:false,
                        singleSelect:true,
                        loadMsg:'',
                        height:'auto',
                        autoRowHeight:true,
                        columns:[[{
                                field:'terminalNo',
                                title:'终端号',
                                align:'left',
                                width:100,
                                formatter: function(value, r){                                  
                                    return ifNull(r.terminalNo);
                                }
                            },{
                                field:'printShopName',
                                title:'打印商户名称',
                                align:'left',
                                width:100,
                                formatter: function(value,r){
                                    return ifNull(r.printShopName);
                                }
                            }
                             
                        ]], 
                        onResize:function(){                        
                                ddv.datagrid('fixDetailRowHeight',index1);
                                $('#dg').datagrid('fixDetailRowHeight',index);
                         },
                        onLoadSuccess:function(){
                            setTimeout(function(){                                  
                                ddv.datagrid('fixDetailRowHeight',index1);//在加载成功时，获取父列表的明细高度，使其适应明显点开后的高度，注意此时的行索引为index1
                                ddv.datagrid('fixRowHeight',index1);//在加载成功时，获取子明细点开后父列表的列高，防止在超过加载成功前的高度时，出现垂直方向的滑动条
                                $('#dg').datagrid('fixDetailRowHeight',index);//在加载成功时，获取爷爷列表的明细高度，使其适应前面父列表和子列表的高度变化，注意此时的行索引为index
                                $('#dg').datagrid('fixRowHeight',index);//在加载成功时，获取父列表的明细点开后爷爷列表的高度，防止在超过加载成功前的高度时，出现垂直方向的滑动条
                            },0);
                        }
                    });
                    ddv.datagrid('fixDetailRowHeight',index1);
                    ddv.datagrid('fixRowHeight',index1);
                    $('#dg').datagrid('fixDetailRowHeight',index);
                    $('#dg').datagrid('fixRowHeight',index);
                }, 
                onResize:function(){                    
                        $('#dg').datagrid('fixDetailRowHeight',index);                                      
                },
                onLoadSuccess:function(){
                    setTimeout(function(){
                        $('#dg').datagrid('fixDetailRowHeight',index);//在加载爷爷列表明细（即：父列表）成功时，获取此时整个列表的高度，使其适应变化后的高度，此时的索引
                        $('#dg').datagrid('fixRowHeight',index);//防止出现滑动条
                    },0);
                }
            });
            $('#dg').datagrid('fixDetailRowHeight',index);
        }
         
    });             
}
 
/**
 * 显示合同详情
 * @param {} signSysNo
 */
function showSignDetail(signSysNo) {
    addTab('合同详情', '../contractController/searchContractDetail.do?signSysNo=' + signSysNo);
}

转载于:https://my.oschina.net/yonghan/blog/478258