--最近客户提出的需求 全选高亮样式太丑,每行选中不需要背景图片颜色,字体变黑色,未选中变灰色。 先把代码和改变后的图片 贴出来。


/* 初始化DataFrid数据 */
initDataGrid: function () {
var pNumber = 0;
var pSize = 10;
$('#listBuyer').datagrid({
method: 'post',
url: 'PR012_TradeRelationService.ashx?Method=GetPR012_TradeRelation_New&type=1&tradeID=' + $("#PC010_TradeIDDetail").val(),
nowrap: true,
fitColumns: false, ////为了冻结列!这里一定要设置为false
loadMsg: '正在加载数据...', showFooter: true,
pagination: true,
pageSize: 20, //每页显示的记录条数,默认为10
pageNumber: 1, //默认的页码
pageList: [30, 20, 10], //可以设置每页记录条数的列表
frozenColumns: [[{ title: '唯一ID', field: 'PC012_RelationID', width: 100, checkbox: true },
{ title: '受让方名称', field: 'EC101_WRYMC', width: 300,
formatter: function (value, row, index) { //判断 1选中 0未选中
if (row.relation == 1) {
initTool.indexs += index + ",";
} else if (row.relation == 0) {
initTool.indexs0 += index + ",";
}
return value;
}
},
{ title: '项目名称', field: 'PC004_ProjectName', width: 300 }
// { title: 'zd', field: 'zd', width: 300 }
// ,
// { title: '录入人', field: 'UserName', width: 80 }
]],
columns: [[
{ title: '化学需氧量', align: 'center' },
{ title: '氨氮', align: 'center' },
{ title: '二氧化硫', align: 'center' },
{ title: '氮氧化物', align: 'center' }
],
[
{ title: '需求量</br>(吨)', field: 'cod_count', width: 170, align: 'center',
formatter: function (value, row, index) {
var str = "0";
if (value) {
str = value;
}
if (str == "0")
return "/";
else
return parseFloat(str).toFixed(4);
}
},
{ title: '需求量</br>(吨)', field: 'nh3_count', width: 170, align: 'center',
formatter: function (value, row, index) {
var str = "0";
if (value) {
str = value;
}
if (str == "0")
return "/";
else
return parseFloat(str).toFixed(4);
}
},
{ title: '需求量</br>(吨)', field: 'so2_count', width: 170, align: 'center',
formatter: function (value, row, index) {
var str = "0";
if (value) {
str = value;
}
if (str == "0")
return "/";
else
return parseFloat(str).toFixed(4);
}
},
{ title: '需求量</br>(吨)', field: 'nox_count', width: 170, align: 'center',
formatter: function (value, row, index) {
var str = "0";
if (value) {
str = value;
}
if (str == "0")
return "/";
else
return parseFloat(str).toFixed(4);
}
}
]],
toolbar: '#tbBuyer', // id 为tb的Div 详细 查看前台页面HTML代码
rowStyler: function (index, row) {
var rows = $("#listBuyer").datagrid("selectRow"); //
if (rows) {
return 'color:#000000;';
} else {
return 'color:#C0C0C0;';
}
},
onBeforeLoad: function () {
$(this).datagrid('rejectChanges');
}, //选中变黑色
onSelect: function (index, row) {
var opt = $(this).datagrid("options");
var rows1 = opt.finder.getTr(this, "", "selected", 1);
var rows2 = opt.finder.getTr(this, "", "selected", 2);
if (rows1.length > 0) {
$(rows1).each(function () {
var tempIndex = parseInt($(this).attr("datagrid-row-index"));
if (tempIndex == index) {
$(this).css('color', '#000000');
}
});
}
if (rows2.length > 0) {
$(rows2).each(function () {
var tempIndex = parseInt($(this).attr("datagrid-row-index"));
if (tempIndex == index) {
$(this).css('color', '#000000');
}
});
} }, //取消选中变灰色
onUnselect: function (index, row) {
var opt = $(this).datagrid("options");
var rows1 = opt.finder.getTr(this, "", "allbody", 1);
var rows2 = opt.finder.getTr(this, "", "allbody", 2);
if (rows1.length > 0) {
$(rows1).each(function () {
var tempIndex = parseInt($(this).attr("datagrid-row-index"));
if (tempIndex == index) {
$(this).css('color', '#C0C0C0');
}
});
}
if (rows2.length > 0) {
$(rows2).each(function () {
var tempIndex = parseInt($(this).attr("datagrid-row-index"));
if (tempIndex == index) {
$(this).css('color', '#C0C0C0');
}
});
}
},
onUncheck: function (index, row) {
initTool.AddUpdate(1, 4);
},
onCheck: function (index, row) {
initTool.AddUpdate(1, 4);
var opt = $(this).datagrid("options");
var rows1 = opt.finder.getTr(this, "", "selected", 1);
var rows2 = opt.finder.getTr(this, "", "selected", 2);
if (rows1.length > 0) {
$(rows1).each(function () {
$(this).removeClass("datagrid-row-selected");
});
}
if (rows2.length > 0) {
$(rows2).each(function () {
$(this).removeClass("datagrid-row-selected");
});
} },
// onClickRow: function (rowIndex, rowData) {
// // alert(rowData["PC012_RELATIONID"]);
// // alert(rowData["EC101_WRYMC"]);
// var row = $("#listBuyer").datagrid("getSelected"); // 获取选中项
// if (row) {
// $('#A1').linkbutton('enable');
// initTool.AddUpdate(1, 4);
// } else {
// $('#A1').linkbutton('disable');
// }
// },
onDblClickRow: function (rowIndex, rowData) {
//$("#list").datagrid("unselectAll"); //取消所有
//$("#list").datagrid("selectRow", rowIndex); //选中当前行
//修改操作
//initTool.edit();
},
onLoadSuccess: function (data) {
// var pr1 = eval(data).total;
// initTool.pr = pr1;
//alert(eval(data).total);
if ($("#ck").val() == "loadck") {
var rows = $('#listBuyer').datagrid('getRows');
if (initTool.indexs != null && initTool.indexs != "") {
//循环出 选中的下标,选中
var cd = initTool.indexs;
// var cd = initTool.indexs.substring(0, c.length - 1);
// alert(cd.split(","));
var a = cd.split(",");
for (var i = 0; i < a.length; i++) {
$("#listBuyer").datagrid("selectRow", a[i]);
}
//循环出 未选中的,以便改变颜色
var cd0 = initTool.indexs0;
var a0 = cd0.split(","); for (var j = 0; j < a0.length; j++) {
var opt = $(this).datagrid("options");
var rows1 = opt.finder.getTr(this, "", "allbody", 1);
var rows2 = opt.finder.getTr(this, "", "allbody", 2);
// if (rows1.length >= 0) {
if (a0[j] != null && a0[j] != "") {
$(rows1).each(function () {
var tempIndex = parseInt($(this).attr("datagrid-row-index"));
if (tempIndex == a0[j]) {
$(this).css('color', '#C0C0C0');
}
});
// }
// if (rows2.length >= 0) {
$(rows2).each(function () {
var tempIndex = parseInt($(this).attr("datagrid-row-index"));
if (tempIndex == a0[j]) {
$(this).css('color', '#C0C0C0');
}
});
}
}
}
} else {
// $('#listBuyer').datagrid('selectAll');
$('#listBuyer').datagrid('checkAll');
var opt = $(this).datagrid("options");
var rows1 = opt.finder.getTr(this, "", "selected", 1);
var rows2 = opt.finder.getTr(this, "", "selected", 2);
if (rows1.length > 0) {
$(rows1).each(function () {
$(this).removeClass("datagrid-row-selected");
});
}
if (rows2.length > 0) {
$(rows2).each(function () {
$(this).removeClass("datagrid-row-selected");
});
}
initTool.AddUpdate(1, 5);
}
}
}); }

这个网上有比较详细的 http://www.cnblogs.com/cnjava/archive/2013/01/21/2869876.html 可以参考一下


Easyui 去掉datagrid 行的样式,并点击checked 改边行颜色!的更多相关文章

  1. 为何给CheckBox设置了checked属性还是没有勾选,行内样式都显示了checked

    为何给CheckBox设置了checked属性还是没有勾选,行内样式都显示了checked 正常情况下我们设置给CheckBox一个checked属性后一般都会选中 然而我今天在做案例的时候却遇到了类 ...

  2. easyui的datagrid组件,如何设置点击某行不会高亮该行的方式

    easyui的datagrid组件,有些时候我们点击某行不想高亮显示,如何设置点击某行不会高亮该行的方式,有好几种方法可以实现,我举几个,可以根据你具体需求灵活应用: 1.修改easyui的css将高 ...

  3. 原生js去除行内样式

    概述 今天我用js给dom元素设置样式,碰到了一些问题,记下来供以后开发时参考,相信对其他人也有用. 心得 js加上class: $dom.classList.add('some-class'); j ...

  4. easyUI的datagrid每行数据添加操作按钮的方法

    今天做项目的时候,想在easyui的datagrid每一列数据后边都加上一个操作按钮,一开始想在后台拼接字符串用JSON传回,但是我测试之后发现这个方法不管用,在网上搜索了一下,整理如下: 其实要加一 ...

  5. 给Jquery easyui 的datagrid 每行增加操作链接(转)

    http://www.thinkphp.cn/code/207.html 通过formatter方法给Jquery easyui 的datagrid 每行增加操作链接我们都知道Jquery的EasyU ...

  6. easyui的datagrid行的某一列添加链接

    通过formatter方法给easyui 的datagrid 每行增加操作链接. 效果图 jsp代码: <th field="url" width="100&quo ...

  7. EasyUI的datagrid获取所有正在编辑状态的行的行编号

    今天项目需要用了下EasyUI的datagrid的行编辑功能,跟着API来,只要是将各种状态时的处理逻辑弄好,还是蛮不错的. 开发过程中,遇到了个问题,在编辑完成后我需要获取datagrid所有处于编 ...

  8. easyui,datagrid表格,行内可编辑

    最近用到easyui,需要表格内编辑,但是我同一个页面有多个表格,把官方的代码修改了一下,如下: HTML代码 <table id="dg" class="easy ...

  9. 【技巧】easyUI的datagrid,如何在翻页以后仍能记录被选中的行

    easyUI的datagrid在复选框多选时,如何在翻页以后仍能记录被选中的行: 注意datagrid中需要配置idField属性,一般为数据的主键

随机推荐

  1. cocos2d-x3.x自定义事件

    -- 自定义事件 -- 监听: local eventDispatcher = self:getEventDispatcher();--self为继承Node的对象 local function ha ...

  2. 解决Linux下启动Tomcat遇到Neither the JAVA_HOME nor the JRE_HOME environment variable is defined

    找到启动路径所在的目录: cd bin/ vi catalina.sh 加入以下信息: export JAVA_HOME=/home/gongzi/http/jdk1.6.0_26 export JR ...

  3. Mac安装mysql

    ### 第一步 安装后一定要记住初始密码 ### 第二步 打开终端 cd /usr/local/mysql/bin ./mysql -u root -p #输入初始密码 set password = ...

  4. 高端大气上档次的fullPage.js

    简介 4月15日,网易邮箱升级到6.0版本,并发布了介绍页面,页面采用了时下非常流行的"全屏"效果,文字.图片再加上 CSS3 动画,让用户非常直观.清晰的了解6.0版本的功能及特 ...

  5. MVC

    PureMVC--一款多平台MVC框架 http://www.jianshu.com/p/47deaced9eb3 MVC,MVP 和 MVVM 的图示 http://www.ruanyifeng.c ...

  6. 在Unity中使用UGUI修改Mesh绘制几何图形

    在商店看到这样一个例子,表示很有兴趣,他们说是用UGUI做的.我想,像这种可以随便变形的图形,我第一个就想到了网格变形. 做法1: 细心的朋友应该会发现,每个UGUI可见元素,都有一个‘Canvas ...

  7. mysql 快速简单安装法

    网上下载的编译好的包 最好安装在 /usr/local 目录下面: 我用的mysql的版本的是:mysql--linux-i686-icc-glibc23.tar.gz 在官网上就可以下载到. 先期工 ...

  8. Subsonic使用中

    使用中,遇到各种奇葩问题,依依汇总. 1.引用了Subsonic层后,一运行就开始报错,提示未能找到文件!!    //引用后,目标框架可能会被改变,subsonic的默认框架是2.0,请检查框架是否 ...

  9. BZOJ2134——单选错位

    1.题意:这就是说考试的时候抄串了一位能对几个(雾) 2.分析:这是一个期望问题,期望就是平均,E(a+b)=E(a)+E(b),所以我们直接算出每个点能对几个就好,那么就是1/max(a[i],a[ ...

  10. 掌握 Linux PC 性能之基准测试

    导读 基准测试是一项测试或一系列测试,用来确定某个计算机硬件运行起来的状况有多好:在许多情况下,“基准测试”实际上等同于“压力测试”,通过测试硬件的极限,然后可以将测得的结果与其他硬件测得的结果作一番 ...