实现效果

原因

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

具体代码

$('#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 onclick="toList('+row.projectId+')" href="javascript:void(0);">【添加子项目】</a>';
html = html + '<a onclick="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);
}
});

easyui datagrid-detailview 嵌套高度自适应的更多相关文章

  1. easyui datagrid detailview嵌套datagrid的问题

    解决问题办法来自 http://www.coding123.net/article/20141113/easyui-datagrid-datailview-use-sub-datagrid-not-a ...

  2. WPF设置DataGrid行内容高度自适应 与 TextBox/TextBlock内容高度自适应

    WPF设置DataGrid行内容高度自适应  TextBox/TextBlock内容高度自适应  参考: DataGrid 控件中的调整大小选项: http://msdn.microsoft.com/ ...

  3. easyui datagrid标题列宽度自适应

    最近项目中使用easyui做前端界面,相信大部分使用过easyui datagrid的朋友有这么一个疑问:如果在columns中不设置width属性能不能写个方法让datagrid的头部标题和数据主体 ...

  4. easyui设置界面的高度自适应

    单独设置界面中特定region区时,高度自适应失败:设置整个界面时成功.实现代码在script块中,具体代码如下: <%@ Page Language="C#" AutoEv ...

  5. easyui datagrid 三层嵌套

    代码: function local(role,region,ip){ $("#roleList").datagrid({ // title:'服务器监控列表', height:( ...

  6. jquery easyui datagrid detailview groupview添加自定义视图view

    var myview = $.extend({}, $.fn.datagrid.defaults.view, { onAfterRender: function (target) { $.fn.dat ...

  7. jquery easyui datagrid 空白条处理 自适应宽高 格式化函数formmater 初始化时会报错 cannot read property 'width'||'length' of null|undefined

    1---表格定义好之后右侧可能会有一个空白条 这个空白条是留给滚动条的,当表格中的一页的数据在页面中不能全显示时会自动出现滚动条,网上有很多事要改源码才可以修改这个,但是当项目中多处用到时,有的需要滚 ...

  8. EasyUI combobox 下拉高度自适应

    要指出的是,combobox是继承自combo的,所以,combo的属性也可以被combobox使用,该问题也是这样产生的,知道这个原理,该问题就解决一半了,另一点要指出的是,在easyui中,num ...

  9. 如何使easyui的datagrid 高度自适应

    如何使easyui的datagrid 高度自适应? 最开始使用easyui的datagrid加载数据时,对其设置的高度都是固定值,数据较多时table表现为滚动条形式.某天,老大突然需要datagri ...

随机推荐

  1. 机器学习-Probabilistic interpretation

    Probabilistic interpretation,概率解释  解释为何线性回归的损失函数会选择最小二乘 表示误差,表示unmodeled因素或随机噪声,真实的y和预测出来的值之间是会有误差的, ...

  2. PAT甲级考前整理(2019年3月备考)之三,持续更新中.....

    PAT甲级考前整理一:https://www.cnblogs.com/jlyg/p/7525244.html,主要讲了131题的易错题及坑点 PAT甲级考前整理二:https://www.cnblog ...

  3. cookie设置和读取以及获取超链接参数

    function setCookie(c_name, value, expiredays) { var exdate = new Date() exdate.setDate(exdate.getDat ...

  4. MyHome3D在线装修设计软件测评

    人人都是设计师 ——MyHome3D在线装修设计软件 关键词:云技术,3D呈现效果,自主设计,简单易用,家具装修设计 上海爱福窝云技术有限公司借助于前沿的3D渲染技术,降低了装修设计的门槛,真正实现了 ...

  5. ZooKeeper系列(二)

    Zookeeper的环境配置 一.Zookeeper的搭建方式 Zookeeper安装方式有三种,单机模式和集群模式以及伪集群模式. 1.单机模式:Zookeeper只运行在一台服务器上,适合测试环境 ...

  6. 拦截导弹问题(Noip1999)

    1322:[例6.4]拦截导弹问题(Noip1999) 时间限制: 1000 ms         内存限制: 65536 KB提交数: 3843     通过数: 1373 [题目描述] 某国为了防 ...

  7. Debug:This kind of launch is configured to openthe debug perspective when it解决办法

    http://blog.sina.com.cn/s/blog_7ca3aa020100zlha.html 启动tomcat时,myeclipse报错: This kind of launch is c ...

  8. java.util.MissingResourceException: Can't find bundle for base name db, locale zh_CN

    在使用Bundle来加载配置文件的时候, 爆出了这个错误: 原因? 没有找到需要加载的配置文件,因为配置文件必须放在src目录下面, 如果放进了com.bj186.crm的包下面,就必须添加包的名称到 ...

  9. oracle分配权限 学习笔记--转载

    在全局数据库ORCL下创建一个用户首先在开始-->运行——>sqlplus,然后输入 sys/change_on_install as sysdba 以sys权限登陆进去 然后可以进行操作 ...

  10. [bzoj2806][Ctsc2012]Cheat(后缀自动机(SAM)+二分答案+单调队列优化dp)

    偷懒直接把bzoj的网页内容ctrlcv过来了 2806: [Ctsc2012]Cheat Time Limit: 20 Sec  Memory Limit: 256 MBSubmit: 1943   ...