easyui datagrid-detailview 嵌套高度自适应

实现效果


原因

异步加载,明细展开时,可能会遇到父列表不能自动适应子列表高度的变化

具体代码

$('#centerdatagrid').datagrid({
    	url:'${ctx}/offer/offer!projectPage.htm',
        title: '项目列表',
        iconCls:'iconfont icon-iconlist',
        toolbar: '#toolbar',
        border: false,
        fit: true,
        singleSelect: true,
        striped : true,
        toolbar: '#toolbar',
        pagination: true,
        pageSize: 20,
        rownumbers: true,
        fitColumns: false,
        autoRowHeight:true,
        columns: [
		[	
		 	{field: 'name', title: '项目名称'},
		 	{field: 'projectTreeName', title: '项目分类'},
		 	{field: 'customer', title: '客户'},
		 	{field: 'salesperson', title: '销售员'},
		 	{field: 'bidder', title: '报价人'},
		 	{field: 'offerTime', title: '时间'},
		 	{field: 'description', title: '备注'},
		 	{field: 'operate', title: '操作',
		 		formatter: function(value,row,index){
		 			var html = '<a οnclick="toList('+row.projectId+')" href="javascript:void(0);">【添加子项目】</a>';
		 			html = html + '<a οnclick="toList('+row.projectId+')" href="javascript:void(0);">【查看报价清单】</a>';
		 			return html;
				}
		 	}
		]
        ],
        onBeforeLoad:function(){},
        onLoadSuccess:function(){},
        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:'${ctx}/offer/offer!projectPage.htm',
            	fitColumns:true,
                singleSelect:true,
                loadMsg:'',
                //height:'auto',
                autoRowHeight:true,
                pagination: true,
                pageSize: 20,
                columns: [
        		[	
        		 	{field: 'name', title: '项目名称'},
        		 	{field: 'projectTreeName', title: '项目分类'},
        		 	{field: 'customer', title: '客户'},
        		 	{field: 'salesperson', title: '销售员'},
        		 	{field: 'bidder', title: '报价人'},
        		 	{field: 'offerTime', title: '时间'},
        		 	{field: 'description', title: '备注'}
        		]
                ],
                onResize:function(){                    
                    $('#centerdatagrid').datagrid('fixDetailRowHeight',index);                                      
	            },
	            onLoadSuccess:function(){
	                setTimeout(function(){
	                    $('#centerdatagrid').datagrid('fixDetailRowHeight',index);//在加载爷爷列表明细(即:父列表)成功时,获取此时整个列表的高度,使其适应变化后的高度,此时的索引
	                    $('#centerdatagrid').datagrid('fixRowHeight',index);//防止出现滑动条
	                },0);
	            }
            });
            $('#centerdatagrid').datagrid('fixDetailRowHeight',index);
        }
    });


转载于:https://www.cnblogs.com/caohaifeng/p/5550725.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值