问题背景:
在做打印页面的时候,要求有详细的默认展开显示。 
 
遇到的问题:
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. Numpy中扁平化函数ravel()和flatten()的区别

    在Numpy中经常使用到的操作由扁平化操作,Numpy提供了两个函数进行此操作,他们的功能相同,但在内存上有很大的不同. 先来看这两个函数的使用: from numpy import * a = ar ...

  2. git克隆和上传项目

    软件环境: 1. VS2017 2. Git ver 2.17.0.1 3. gitee.com 目的: 已有的本地项目(新建)上传到码云,使本地可以和码云同步 尝试: 先在码云上建立项目,项目名称和 ...

  3. Jmeter使用指南----压力测试工具

    来源: https://blog.csdn.net/u012111923/article/details/80705141 https://www.cnblogs.com/st-leslie/p/51 ...

  4. URL中参数为数组

    今天写代码时候碰到了一个需要在URL中传递数组类型的参数,记录一下. var urlstr = "http://test"; var test = new Array(); for ...

  5. Linux下与Windows下开发软件

    Linux下开发程序可以完全发挥自己的聪明才智,因为系统内核是完全开放的.Windows下开发程序就稍微郁闷一点,不论何种语言都必须在调用系统API的基础上开发,因为系统内核是不开放的. 这两种系统正 ...

  6. 性能调优之vmstat命令(转)

    vmstat是Virtual Meomory Statistics(虚拟内存统计)的缩写,可对操作系统的虚拟内存.进程.IO读写.CPU活动等进行监视.它是对系统的整体情况进行统计,不足之处是无法对某 ...

  7. golang bufio.Scanner

    一, 我们一般会这么用,接收 标准输入的东西: scanner := bufio.NewScanner(os.Stdin) for scanner.Scan() { fmt.Println(scann ...

  8. MySQL查询操作select

    查找记录 SELECT select_expr [,select_expr ...] [ FROM table_references(表的参照) [WHERE where_condition](条件) ...

  9. pycharm安装与使用

    python是一门解释性编程语言,所以一般把写python的工具叫解释器.写python脚本的工具很多,小编这里推荐pycharm,是小编用过最好用的一个工具.比较顺手的一个.而且可以跨平台,在mac ...

  10. document.documentElement和document.body 与document.compatMode的关系

    首先我们看看document.compatMode(兼容模式): document.compatMode它有两种可能的返回值:BackCompat和CSS1Compat, document.compa ...