带有动态列的DataTables方括号负插件

问题描述 投票:0回答:1

我有一个数据表,在初始化之前我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并删除了括号,它也可以使用。

jquery datatables currency
1个回答
0
投票

似乎括号为负的插件不支持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 );
    };
}());
© www.soinside.com 2019 - 2024. All rights reserved.