我有一个使用datatables.js的html表,并且无法找到如何应用条件格式的明确示例.
当值== 0且第5列中的值为!= 0时,如何更改第4列中单元格的文本颜色
<script>
$(document).ready(function () {
$("#GeneratedData").dataTable({
"sDom": 'T<"clear">lrtip',
"oTableTools": {
"sSwfPath": "http://localhost:5637/Content/swf/copy_csv_xls_pdf.swf"
},
"sPaginationType": "full_numbers"
});
})
</script>
Run Code Online (Sandbox Code Playgroud)
dav*_*rad 14
更新.最初的答案是针对dataTables 1.9.x. 它仍然有效,并且也适用于dataTables 1.10.x(到目前为止),但这里是一个纯dataTables 1.10.x版本:
var table = $('#example').DataTable({
rowCallback: function(row, data, index) {
if (data[3]=='0' && data[4]!='0') {
$(row).find('td:eq(3)').addClass('color')
}
}
})
Run Code Online (Sandbox Code Playgroud)
演示 - > http://jsfiddle.net/2chjxduy/
你应该使用这个fnRowCallback事件.来自文档:
此功能允许您在为每个表格绘制生成每个行之后,但在它在屏幕上呈现之前对每个行进行"后处理".此函数可用于设置行类名等.
所以在你的情况下,这样做:
$("#GeneratedData").dataTable({
//your settings as above here
fnRowCallback: function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
if ($(nRow).find('td:eq(3)').text()=='0' &&
$(nRow).find('td:eq(4)').text()!='0') {
$(nRow).find('td:eq(3)').addClass('color');
}
}
});
Run Code Online (Sandbox Code Playgroud)
color是一个预定义的CSS类.在这个jsfiddle中看到它的实际效果 - > http://jsfiddle.net/GfNeA/
| 归档时间: |
|
| 查看次数: |
7900 次 |
| 最近记录: |