代码:

function local(role,region,ip){
$("#roleList").datagrid({
// title:'服务器监控列表',
height:($(window).height())-35,
iconCls : 'icon-ok',
width:"100%",
pageSize : 15,//默认选择的分页是每页5行数据
pageList : [ 15,50,100,150 ],//可以选择的分页集合
nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取
striped : true,//设置为true将交替显示行背景。
collapsible : true,//显示可折叠按钮
toolbar:"#tb",//在添加 增添、删除、修改操作的按钮要用到这个
url:'config/getRoleList.action',//url调用Action方法
loadMsg : '数据装载中......',
singleSelect:true,//为true时只能选择单行
fitColumns:true,//允许表格自动缩放,以适应父容器
//sortName : 'xh',//当数据表格初始化时以哪一列来排序
//sortOrder : 'desc',//定义排序顺序,可以是'asc'或者'desc'(正序或者倒序)。
remoteSort : false,
pagination : true,//分页
rownumbers : true,//行数
queryParams:{'role_id':role,'region':region,'ip':ip},
onLoad:function(index,row){
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('selectRow',index);
$('#roleList').datagrid('getRowDetail',index).find('form').form('load',row);
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('fixRowHeight', index);
},
onLoadSuccess:function(index,row){
setTimeout(function(){
$('#roleList').datagrid('fixRowHeight',index);
$('#roleList').datagrid('fixDetailRowHeight',index);
},0)
},
onResize:function(index,row){//严重注意喔
$('#roleList').datagrid('fixDetailRowHeight',index);
},
rowStyler:function(index,row){ },
view: detailview,
detailFormatter:function(index,row){//严重注意喔
return '<div"><table id="ddv-' + index + '" ></table></div>';
},
onExpandRow: function(index,row){//嵌套第一层,严重注意喔
var ddv = $(this).datagrid('getRowDetail',index).find('#ddv-'+index);//严重注意喔
ddv.datagrid({
// view: detailview,
url:'report/getAlarmSystem.action',
autoRowHeight:true,
fitColumns:true,//改变横向滚动条
singleSelect:false,//去掉选中效果
rownumbers:true,
loadMsg:'',
queryParams:{'role_id':row.id,'region':region,'ip':ip},
height:'auto',
columns:[[
{field:'XXX',title:'XXX',width:70,align:'center',},
{field:'XXX',title:'XXX',width:70,align:'center',},
{field:'XXX',title:'XXX',width:50,align:'center',},
]],
onLoad:function(){
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('selectRow',index);
$('#roleList').datagrid('getRowDetail',index).find('form').form('load',row);
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('fixRowHeight', index);
},
onResize:function(){
$('#roleList').datagrid('fixDetailRowHeight',index);
},
rowStyler:function(index1,row1){
if (row1.mstatus=='2'){
return 'background-color:#FF6347;';
}else if(row1.mstatus=='1'){
return 'background-color:#FFF68F;';//黄色
}else if(row1.mstatus=='0'){
return 'background-color:#98FB98;';
}
},
onLoadSuccess:function(){
setTimeout(function(){
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('fixRowHeight',index);//防止出现滑动条
},0);
},
view: detailview,
detailFormatter:function(index,row){//严重注意喔
return '<div"><table id="ddvv-' + index + '" ></table></div>';
},
onExpandRow: function(index,row){//嵌套第一层,严重注意喔
var ddvv = $(this).datagrid('getRowDetail',index).find('#ddvv-'+index);//严重注意喔
ddvv.datagrid({
// view: detailview,
url:'report/getSystemMonitor.action',
autoRowHeight:true,
fitColumns:true,//改变横向滚动条
singleSelect:false,//去掉选中效果
rownumbers:true,
loadMsg:'',
queryParams:{'ip':row.ip},
height:'auto',
columns:[[
   {field:'XXX',title:'XXX',width:80,align:'center',},
{field:'XXX',title:'XXX',width:100,align:'center',},
{field:'XXX',title:'XXX',width:200,align:'center',},
{field:'XXX',title:'XXX',width:50,formatter:setAlarm,align:'center',},
{field:'XXX',title:'XXX',width:150,align:'center',},
{field:'XXX',title:'XXX',width:100,align:'center',}
]],
onLoad:function(){
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('selectRow',index);
$('#roleList').datagrid('getRowDetail',index).find('form').form('load',row);
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('fixRowHeight', index);
},
onResize:function(){
$('#roleList').datagrid('fixDetailRowHeight',index);
},
rowStyler:function(index1,row1){
if (row1.alarm_level=='2'){
return 'background-color:#FF6347;';
}else if(row1.alarm_level=='1'){
return 'background-color:#FFF68F;';//黄色
}else if(row1.alarm_level=='0'){
return 'background-color:#98FB98;';
}
},
onLoadSuccess:function(){
setTimeout(function(){
$('#roleList').datagrid('fixDetailRowHeight',index);
$('#roleList').datagrid('fixRowHeight',index);//防止出现滑动条
},0);
}
});
}
});
}
});
}

easyui datagrid 三层嵌套的更多相关文章

  1. easyui datagrid detailview嵌套datagrid的问题

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

  2. easyui datagrid属性和方法

    本文可以当做api来使用 使用方法(Usage Example) 从现有的表单元素创建数据表格,定义在html中的行,列和数据. <table class="easyui-datagr ...

  3. 数据网格和树-EasyUI Datagrid 数据网格、EasyUI Propertygrid 属性网格、EasyUI Tree 树、EasyUI Treegrid 树形网格

    EasyUI Datagrid 数据网格 扩展自 $.fn.panel.defaults.通过 $.fn.datagrid.defaults 重写默认的 defaults. 数据网格(datagrid ...

  4. easyui datagrid的API

    本文可以当做api来使用 动态编辑用到DOM解析的话参考 http://www.w3school.com.cn/xmldom/dom_htmlcollection.asp 使用方法(Usage Exa ...

  5. JQuery easyUI DataGrid 创建复杂列表头(译)

    » Create column groups in DataGrid The easyui DataGrid has ability to group columns, as the followin ...

  6. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(8)-MVC与EasyUI DataGrid 分页

    系列目录 前言 为了符合后面更新后的重构系统,文章于2016-11-1日重写 EasyUI Datagrid在加载的时候会提交一些分页的信息到后台,我们需要根据这些信息来进行数据分页再次返回到前台 实 ...

  7. 控制EasyUI DataGrid高度

    这次要说的是控制EasyUI的高度,平时我公司的项目,用EasyUI较多,然后datagrid这个组件是用的非常多的.平时我们都是固定高度,常见代码如下:             <table  ...

  8. EasyUI datagrid 日期时间格式化

    EasyUI datagrid中显示日期时间时,会显示为以下不太直观的数值: 添加以下JavaScript脚本,然后在field中添加 formatter: DateTimeFormatter 即可. ...

  9. easyui datagrid中 多表头方法总结

    easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...

随机推荐

  1. call 和 apply

    call和apply作用一样,都是为了转移this,区别在于传入参数的方式不同. this指当前方法所在的对象,如果方法的外面没有对象,则默认是window.由于闭包虽在调用的方法中,但是在创建的时候 ...

  2. UNITY2018 真机开启deepprofiling的操作

    手机上运行游戏并开启deepprofiling的命令如下 命令一:adb shell am start -n com.szyh.YHP1.kaopu/com.szyh.YHP1.kaopu.MainA ...

  3. python学习笔记之斐波拉契数列学习

    著名的斐波拉契数列(Fibonacci),除第一个和第二个数外,任意一个数都可由前两个数相加得到: 1, 1, 2, 3, 5, 8, 13, 21, 34, ... 如果用Python的列表生成式, ...

  4. vscode项目配置 vue-loader-webpack

    使用vsCode进行项目配置 一.准备工作 1.下载Visual Studio Code 下载地址 2.打开vscode,根据自己需求下载相应插件,可以提高工作效率. 点击下角选项(我作了红框标记), ...

  5. replace()方法解析

    search(),match(),用于查找指定字符串返回首次出现的索引值与指定的字符串.这篇我们讲找到指定字符串之后将其替换掉.直接贴: var str="Visit Microsoft!& ...

  6. 使用javap进行反编译Java枚举

    这是一个枚举类Day.java public enum Day { MONDAY("星期一"), TUESDAY("星期二"), WEDNESDAY(" ...

  7. Excel 整个列数字转换成文本

    选中该列----数据---分列----下一步---到步骤三----列数据格式---勾选"文本"---完成.

  8. yii配置访问路由权限配置

    'verbs' => [ 'class' => VerbFilter::className(), 'actions' => [ 'logout' => ['post', 'ge ...

  9. 使用rtl8192du安装无线驱动步骤

    *************一.直接操作发********** 步骤:1.去Realtek官网下载无线网卡驱动下载地址:点击这里2.驱动在压缩包中的driver目录(也是一个压缩包),将其解压到/opt ...

  10. 初探Mybaties整合分页插件PageHelper(1)

    Mybaites整合分页PageHelper插件 在数据进行分页,通过sql语句,mysql分页,table_name表名,pageNum 第几页,pageSize 每页数据条数: SELECT * ...