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"); } };
评一波