grid默认提供了设置当前选中行的css,没有提供多选行的样式,如果多选的时候要设置选中行的样式,多选取消时把样式取消,可以通过多选和取消触发的事件实现
grid选中数据行上的checkbox时,表示选中本行,会先触发onRowCheck事件,再触发onRowChecked事件
grid取消选中数据行上的checkbox时,表示取消选中本行,会先触发onRowCheck事件,再触发onRowChecked事件
那么就可以利用onRowCheck或者onRowChecked去设置,本案例用的是onRowChecked
1.在css文件中定义一个样式:
.checkedClass{
background:green !important;
}
2.在onRowChecked中判断是选中还是取消(在事件中event.checked为true是选中,为false是取消),选中是添加class,取消是删除class
Model.prototype.grid1RowChecked = function(event) {
var rowid = event.rowID;
var tr = event.source.getRowByID(rowid);
if (event.checked) {
$(tr).addClass("checkedClass");
} else {
$(tr).removeClass("checkedClass");
}
};
评一波