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


/* 初始化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. IE兼容方法

    其实我也觉得非常麻烦,开始的时候都用 _XXX:XXX; /* IE6支持 */ *XXX:XXX; /* IE6.IE7支持 */ *+XXX:XXX; /* IE7支持 */ XXX:XXX\9; ...

  2. Sublime插件:

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue"; color: #e4af0a } ht ...

  3. 利用django创建一个投票网站(六)

    建你的第一个 Django 项目, 第六部分 这一篇从第五部分(zh)结尾的地方继续讲起.再上一节中我们为网络投票程序编写了测试,而现在我们要为它加上样式和图片. 除了服务端生成的 HTML 以外,网 ...

  4. 一些不太常见但很有用的java类

    java.util.concurrent.CopyOnWriteArrayList CopyOnWrite容器只能保证数据的最终一致性,不能保证数据的实时一致性.所以如果你希望写入的的数据,马上能读到 ...

  5. express源码剖析1

    在通读源码之前,先把一些比较难理解的代码吃透: 1.EventEmitter.prototype mixin(app, EventEmitter.prototype, false); app为一个函数 ...

  6. javascript闭包

    关于闭包的介绍,推荐两篇文章: 廖雪峰javascript教程-闭包: http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a ...

  7. NancyFX 简介

    Nancy是.NET 平台的微框架.在受到Ruby社区的Sinatra框架启发下,NancyFx框架提供一个.NET平台下的低门槛.易上手的可用于Web开发工具包. 请注意我说的是可用于Web开发,这 ...

  8. 【11-10】spring学习笔记-ApplicationContextAware

    package util; /** * @author aloha_world_ * @date 2016年11月10日 下午7:50:08 * @version v1.00 * @descripti ...

  9. 我们平时是怎么写html和css的?

    文章的起因,我只是为了回复一个帖子,http://bbs.csdn.net/topics/390908928?page=1 结果,一扯就根本停不下来.索性,一捅为快,反正是周末. 拿到效果图时,有这么 ...

  10. HTML 内容居中方式总结

    在HTML网页排版经常会用到关于对其方式的情况,水平居中和垂直居中.特别是水平居中,并不是一个简单的text-align就可以解决所有的情况. 开始之前普及一点HTML知识,目标很明显,不同的页面结构 ...