我有一个数据表,在初始化之前我generate dynamic headers为此。这意味着我无法预测列数据类型,因此我依赖于基于数据的DataTables标识列类型,以使排序工作。
返回的某些列具有货币数据(示例格式:$ 234,392.01)。有时,数据用括号括起来代表一个负值:($ 234,392.01)。由于括号的原因,DataTables将该列标识为字符串并将其错误地排序。
我曾尝试使用brackets-negative plug-in,但实际上并没有做任何事情。但是,除了将插件粘贴到代码中之外,我没有做任何其他事情。
要使用方括号负插件,我还需要做些其他事情吗?如果这是由动态列引起的限制,还有其他方法可以解决此问题吗?
请注意,如果该列中没有括号,则DataTables会正确对货币数据进行排序。
测试该插件不起作用的情况(不确定为什么代码格式如此糟糕):
$(document).ready(function() {
var columns = [
{ "data": "Column5", "title": "Column5" },
];
var data = [
{"Column5":"($371.17)"},{"Column5":"$94,170.30"},{"Column5":"$868,588.32"},
{"Column5":"$81,874.09"},{"Column5":"$89.99"},{"Column5":"$2,800,594.59"},
{"Column5":null},{"Column5":null},{"Column5":null},{"Column5":null},
{"Column5":null},{"Column5":null},{"Column5":null},{"Column5":null},
{"Column5":null}
];
$('#example').dataTable( {
"columns": columns,
"data": data
} );
} );
body {
font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
color: #333;
background-color: #fff;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<link href="//datatables.net/download/build/nightly/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>
<script src="https://cdn.datatables.net/plug-ins/1.10.20/sorting/brackets-negative.js"></script>
<meta charset=utf-8 />
<title>DataTables - JS Bin</title>
</head>
<body>
<div class="container">
<table id="example" class="display" width="100%">
</table>
</div>
</body>
</html>
我注意到,如果删除了空记录,它可以工作,但是我需要它与空值一起工作。另外,如果保留了null并删除了括号,它也可以使用。
似乎括号为负的插件不支持null
值。
以下代码是方括号负插件的修改版本,如果数据为null
,则返回'currency';订购时将null
和''
(空字符串)值视为0
。
我能够将0
替换为Number.NEGATIVE_INFINITY
,以便始终将null
和''
视为最小值。
(function(){
// Change this list to the valid characters you want to be detected
var validChars = "$£€c" + "0123456789" + ".-,()'";
// Init the regex just once for speed - it is "closure locked"
var
str = jQuery.fn.dataTableExt.oApi._fnEscapeRegex( validChars ),re = new RegExp('[^'+str+']');
$.fn.dataTableExt.aTypes.unshift(
function ( data )
{
// Added this check for null
if ( data === null) {
return 'currency';
}
if ( typeof data !== 'string' || re.test(data) ) {
return null;
}
return 'currency';
}
);
$.fn.dataTable.ext.type.order['currency-pre'] = function ( data ) {
// Added '|| data === null'
// Treat '' and null as 0
if ( data === '' || data === null) {
return 0;
}
//Check if its in the proper format
if(data.match(/[\()]/g)){
if( data.match(/[\-]/g) !== true){
//It matched - strip out parentheses & any characters we dont want and append - at front
data = '-' + data.replace(/[\$£€c\(\),]/g,'');
}else{
//Already has a '-' so just strip out non-numeric charactors exluding '-'
data = data.replace(/[^\d\-\.]/g,'');
}
}else{
data = data.replace(/[\$£€\,]/g,'');
}
return parseFloat( data );
};
}());