问题背景:
在做打印页面的时候,要求有详细的默认展开显示。 
 
遇到的问题:
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. HTML-JavaScript的DOM操作-非重点部分

    1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档(HTML文档),对象是指文档中每个元素:模型是指抽象划的东西. 2.Windows对象操作 一.属性和方法 属性(值或者 ...

  2. HTML-★★★★★表单★★★★★

    表单 <form id="" name="" method="post/get" action="负责处理的服务端" ...

  3. mongoDB使用小记

    1.简介: MongoDB是由c++语言编写的,基于分布式文件存储的开源数据库系统.MongoDB将数据存储为一个文档,数据结构有键-值对,类似于JSON对象. MongoDB其中的一些概念如下: M ...

  4. 进阶篇:5.3.1)均方根法(Root-Sum-Squares,RSS)

    本章目的:了解均方根法,运用均方根法. 1.定义 均方根法(Root-Sum-Squares,RSS):均方根法是统计分析法的一种,是把尺寸链中的各个尺寸公差的平方之和再开根即得到关键尺寸的公差. 其 ...

  5. Shiro如何使用Ehcache实现Session共享

    最近项目中用到的Session共享场景:两个独立应用,希望实现DB层共享用户,而且用户只需要登录一次. 分析:这种场合,不适用单点,因为用户数据并不需要单独在第三方应用管理,而且添加单点也会增加整个系 ...

  6. js 删除数组的某一项或者几项的方法

    1.arr.splice() splice(index,len,[item])    注释:该方法会改变原始数组. splice有3个参数,它也可以用来替换/删除/添加数组内某一个或者几个值 inde ...

  7. Rsa2验签报错【java.security.SignatureException: Signature length not correct】的解决办法

    在进行RSA2进行验签的时候,报了以下错误: java.security.SignatureException: Signature length not correct: got 344 but w ...

  8. 爬虫--requeste

    1.requeste模块,是我们Python对我们爬虫有好的一面,,其主要作用是用来模拟浏览器发起请求.功能强大,用法简洁高效.在爬虫领域中占据着半壁江山的地位.没有的话直接pip3 install  ...

  9. Vue vs React: Javascript 框架之战

    https://baijiahao.baidu.com/s?id=1608210396818353443&wfr=spider&for=pc    原文档 正如我们之前提到的,Word ...

  10. js中的new操作符与Object.create()的作用与区别

    js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 ...