我有一个数据表,有行突出显示和表排序,但是当我运行两段代码时,一个用于突出显示,一个用于过滤,我得到一个错误。
我明白为什么我得到错误,但无论我如何写代码,一旦我把它们连接在一起的代码停止工作,下面是我的javascript代码和链接到jsfiddle的例子。
$(document).ready( function () {
$('#example').dataTable( {
"aoColumns": [
null,
null,
null,
null,
null,
null,
{ "sType": "date-uk" },
{ "sType": "date-uk" },
{ "sType": "date-uk" },
null,
null,
null
]
});
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"date-uk-pre": function ( a ) {
var ukDatea = a.split('/');
return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},
"date-uk-asc": function ( a, b ) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"date-uk-desc": function ( a, b ) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
});
fnRowCallback: function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
if (aData[3] == "PV PLUS") {
$(nRow).addClass('highlight');
}
if (aData[3] == "ECO1") {
$(nRow).addClass('highlight1');
}
if (aData[3] == "ECO2") {
$(nRow).addClass('highlight2');
}
}
});
链接JSfiddle
编辑代码 $(document).ready( function () {
$('#example').dataTable( {
"aoColumns": [
null,
null,
null,
null,
null,
null,
{ "sType": "date-uk" },
{ "sType": "date-uk" },
{ "sType": "date-uk" },
null,
null,
null
]
});
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"date-uk-pre": function ( a ) {
var ukDatea = a.split('/');
return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},
"date-uk-asc": function ( a, b ) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"date-uk-desc": function ( a, b ) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
});
var table = $('#example').DataTable({
fnRowCallback: function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
if (aData[3] == "PV PLUS") {
$(nRow).addClass('highlight');
}
if (aData[3] == "ECO1") {
$(nRow).addClass('highlight1');
}
if (aData[3] == "ECO2") {
$(nRow).addClass('highlight2');
}
}
});
});
所以我已经更新了我的代码,它不再出错了,但是高亮显示也不工作了。
正确代码如下:
$.extend($.fn.dataTableExt.oSort, {
"date-uk-pre": function(a) {
var ukDatea = a.split('/');
return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},
"date-uk-asc": function(a, b) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"date-uk-desc": function(a, b) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
});
$(document).ready(function() {
$('#example').DataTable({
'columnDefs': [
{ 'type': 'date-uk', 'targets': [6,7,8] }
],
'rowCallback': function( row, data, index ){
if (data[3] == "PV PLUS") {
$(row).addClass('highlight');
}
if (data[3] == "ECO1") {
$(row).addClass('highlight1');
}
if (data[3] == "ECO2") {
$(row).addClass('highlight2');
}
}
});
});
参见更新后的jsFiddle获取代码和演示