DataTables brackets-带动态列的负插件

DataTables brackets-negative plug-in with dynamic columns

我有一个数据表,我在初始化之前 generate dynamic headers 对其进行了设置。这意味着我无法预测列数据类型,因此我依靠 DataTables 根据数据识别列类型来进行排序。

返回的某些列包含货币数据(示例格式:$234,392.01)。有时,数据用括号括起来表示负值:($234,392.01)。由于括号的原因,DataTables 将此列识别为字符串并对其进行了错误排序。

我试过使用 brackets-negative plug-in,但它并没有真正起到任何作用。但是,除了将插件粘贴到我的代码中之外,我没有做任何额外的事情。

使用brackets-negative插件还需要做些什么吗?如果这是由动态列引起的限制,是否有其他方法可以解决此问题?

需要说明的是,如果列中没有括号,DataTables 会正确排序货币数据。

插件不起作用的测试用例(不知道为什么代码格式如此糟糕):

$(document).ready(function() {

  var columns = [
   { "data": "Column5", "title": "Column5" },
  ];
  var data = [
    {"Column5":"(1.17)"},{"Column5":",170.30"},{"Column5":"8,588.32"},
    {"Column5":",874.09"},{"Column5":".99"},{"Column5":",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>

我注意到如果删除空记录它会起作用,但我需要它来处理空记录。此外,如果保留空值并删除括号,它也有效。

好像brackets-negative插件不支持null个值。

下面的代码是brackets-negative插件的修改版本,如果数据是null,return '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 );
    };
}());