问题背景:
在做打印页面的时候,要求有详细的默认展开显示。 
 
遇到的问题:
1)在用扩展行的时候,grid的所有行都添加了展开收起的图标,(第二行没有明细)如下

 2)默认展示有详细行的时候,内容被滚动条遮挡(影响打印)

 
 3) 解决方法:在easyui扩展行的 onLoadSuccess 函数里进行处理 
 $list.datagrid({
view: detailview,
onLoadSuccess: function (data) { //没有详细的行 去掉 展示收起图标
for (var i = 0; i < data.rows.length; i++) {
if (data.rows[i].FeeCategoryID != 1) {
var expander = $('body').find('tr.datagrid-row[datagrid-row-index=' + i + ']');
expander.children('[field="_expander"]').html('');
}
} //默认展开所有详细行
var row = $list.datagrid("getRows");
for (var r = 0; r < row.length; r++) {
$list.datagrid("expandRow", r);
} //去除滚动条
var $ScrH1 = $('.datagrid-view1 .datagrid-body');
var $ScrH2 = $('.datagrid-view2 .datagrid-body');
$ScrH1.height($ScrH2[0].scrollHeight);
$ScrH2.height($ScrH2[0].scrollHeight);
$('.datagrid-view').height($('.datagrid-view2').height());
},
detailFormatter: function (index, row) {
if (row.FeeCategoryID == 1) {
return '<div class="datail-item-wrap" style="padding:5px 0"></div>';
}
},
onExpandRow: function (index, row) {
var feeID = row.FeeCategoryID;
var feeType = feeTypes.first(function (item) { return item.ID == feeID; });
if (feeID == 1) {
var wrap = $(this).datagrid('getRowDetail', index).find('div.datail-item-wrap');
var $cotent = '';
var feeDetail = row.ExpenseClaimFeeItems;
var detailData = JSON.parse(JSON.stringify(feeType.Feecategoryitem));
var dataLen = detailData.length;
for (var ind = 0; ind < dataLen; ind++) {
$cotent += '<li class="datail-item"><span>' + detailData[ind].FeeTypeCNName + ':</span><span>' + toDoubleThousands(feeDetail[ind].AmountWithTax) + '</span></li>';
}
$cotent = '<ul>' + $cotent + '</ul>';
} else {
return
}
wrap.panel({
border: false,
cache: false,
fit: true,
content: $cotent,
onLoad: function () {
$list.datagrid('fixDetailRowHeight', index);
}
});
$list.datagrid('fixDetailRowHeight', index);
}
});
    

easyui扩展行默认展开 以及 去除滚动条的更多相关文章

  1. ASP.NET MVC5+EF6+EasyUI 后台管理系统(83)-Easyui Datagrid 行内编辑扩展

    这次我们要从复杂的交互入手来说明一些用法,这才能让系统做出更加复杂的业务,上一节讲述了Datagird的批量编辑和提交本节主要演示扩展Datagrid行内编辑的属性,下面来看一个例子,我开启编辑行的时 ...

  2. EasyUI扩展方法

    EasyUI扩展方法: 1.我想指定textarea的行,但editor:{type:'textarea', options: {rows:'4'}}这样写不行.请问大家怎么配置才是指定行的啊? 配置 ...

  3. EasyUI扩展——自定义列排序匹配字段

    一些特殊情况下希望实现:单击某些列,但是排序要按照自定义指定另外的列排序 easyui扩展: 如果不写sort属性则按照默认该列的field排序 $.fn.datagrid.defaults.onBe ...

  4. 雷林鹏分享:jQuery EasyUI 扩展

    jQuery EasyUI 扩展 Portal(制作图表.列表.球形图等) 数据网格视图(DataGrid View) 可编辑的数据网格(Editable DataGrid) 可编辑的树(Editab ...

  5. Easyui datagrid行内【添加】、【编辑】、【上移】、【下移】

    前几天项目中遇到一个需求用到了Easyui datagrd行内添加和编辑数据,同时对行内数据上移下移,所以对这几个功能做个总结. 1.首先大概说下这几个功能里用到的主要方法,行内添加数据主要是添加列的 ...

  6. EXT Grid 默认展开所有行

    grid.getStore().load({ //默认展开所有行. callback:function() { var expander = grid.plugins[0]; var count = ...

  7. Jquery easyui开启行编辑模式增删改操作

    Jquery easyui开启行编辑模式增删改操作 Jquery easyui开启行编辑模式增删改操作先上图 Html代码: <table id="dd"> </ ...

  8. [转]Jquery easyui开启行编辑模式增删改操作

    本文转自:http://www.cnblogs.com/nyzhai/archive/2013/05/14/3077152.html Jquery easyui开启行编辑模式增删改操作先上图 Html ...

  9. bootstrap导航条在手机上默认展开二级目录,必须用setTimeout才能实现

    bootstrap导航条在手机上默认展开二级目录,必须用setTimeout才能实现 $(document).ready(function() { $('.dropdown').hover(funct ...

随机推荐

  1. [原创] 项目 watch EMFILE 报错处理过程

    目录 事件 处理过程 参考资料 小知识点 单进程文件句柄限制 系统总文件句柄限制 inotify 文件系统事件监控 事件 公司XX游戏 S114服启动失败(使用 pomelo - node.js 框架 ...

  2. css实现视觉差的滚动

    之前在逛知乎的时候,发现知乎app首页中偶尔掺杂的广告图片,都是做的视觉差的效果,广告图片的向上速度明显比外面页面的上拉速度慢了很多,看起来很炫酷,然后在网上看了下,发现有很多js插件可以实现这种效果 ...

  3. 苹果Air A1466进入系统黑屏

    现象:苹果Air A1466笔记本安装Windows 7系统后,安装官网对应型号的bootcamp后,重启机器,在Windows滚动条完成后随即进入黑屏状态,安全模式能够进入,在安全模式下卸载删除显卡 ...

  4. jq扩展获取表单值、设置值

    不多说,直接上代码 //jq添加插件 (function (window, $) { $.fn.serializeJson = function () { var serializeObj = {}; ...

  5. 人机交互print

    python两种输出类型: 1· 表达式语句,python理解的 #  repr() 2· print() 结果是给用户看的      # str()  >>> "Hell ...

  6. myEclipse或eclipse复制或修改项目后的部署名称

    第一种方式: 右键工程-properties-Deployment-Deployment Assembly下 修改Web Content Root名称即可.见下图 第二种方式: 右键工程-proper ...

  7. XML 十六进制值 是无效的字符错误 解决方法之一 转

    /// <summary> /// 过滤非打印字符 /// </summary> /// <param name="tmp">待过滤</p ...

  8. (转)mysql帮助命令使用说明

    https://www.ilanni.com/?p=8157------- 烂泥:mysql帮助命令使用说明

  9. Delphi对Word的基本操作

    一.Delphi程序启动Word 采用CreateOleObjects的方法来启动Word,调用VBA代码,具体实现过程为: 首先使用GetActiveOleObject('Word.Applicat ...

  10. JS原型与原型链(好文看三遍)

    一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object ,Function 是JS自带的函数对象. 下面举例说明: function ...