如何在Codeigniter中汇总数据表

如何解决如何在Codeigniter中汇总数据表

结果刚刚显示 $NaN ( $NaN total)

我只是从datatables复制代码，并且只更改了要加和的列。 这是我的代码之前

<script>
$(document).ready(function() {
$('#tableoperasional').DataTable( {
  "footerCallback": function ( row,data,start,end,display ) {
     var api = this.api(),data;
                             
     // Remove the formatting to get integer data for summation
     var intVal = function ( i ) {
       return typeof i === 'string' 
         ? i.replace(/[\$,]/g,'') * 1
         : typeof i === 'number'
         ? i 
         : 0;
     };

    // Total over all pages
    total = api
      .column( 2 )
      .data()
      .reduce( function (a,b) {
        return intVal(a) + intVal(b);
      },0 );
                             
      // Total over this page
      pageTotal = api
        .column( 2,{ page: 'current'} )
        .data()
        .reduce( function (a,b) {
          return intVal(a) + intVal(b);
        },0 );
                             
        // Update footer
        // Update footer
        $( api.column( 2 ).footer() ).html(
          '$'+pageTotal +' ( $'+ total +' total)'
        );
      }
    });
  });
</script>

我还更新了js库，但仍然没有任何反应。希望您的帮助。

解决方法

主要问题

我认为问题出在您的intVal函数之内。当将String传递给它时，所有$和,字符都将被删除，结果乘以1（将其转换为Number） 。但是，如果String.prototype.replace没有删除所有非数字字符，则转换将失败并返回NaN。

例如：

var valueInColumn = '12,45%';
var nanResult = valueInColumn.replace(/[\$,]/g,'') * 1;
console.log(nanResult);

除了使用隐式转换（* 1）以外，还可以通过parseFloat / parseInt使用显式转换。相对于隐式转换，它的意图更清晰，也更安全：

var intVal = function (i) {
  return typeof i === 'string'
    ? parseFloat(i.replace(/[\$,'')) // <-- here
    : typeof i === 'number'
    ? i
    : 0;
}

万一这不能解决问题，可以使intVal更加安全/严格。方法如下：

var safeIntVal = i => {
  var rval = i;
  if (typeof rval === 'string') {
    rval = parseFloat(rval.replace(/[^\d\.]/g,''));    // <-- remove all non-numeric characters except dots and convert into a number
  }
  if (typeof rval !== 'number' || Number.isNaN(rval)) { // <-- if the result of the conversion isn't a number or is NaN,set it to zero
    rval = 0;
  }
  return rval;                                          // <-- return
}

在以下代码段中可以看出这两种实现方式之间的差异：

var intVal = function ( i ) {
  return typeof i === 'string' 
    ? i.replace(/[\$,'') * 1
    : typeof i === 'number'
    ? i 
    : 0;
};

var safeIntVal = function (i) {
  var rval = i;
  if (typeof rval === 'string') {
    rval = parseFloat(rval.replace(/[^\d\.]/g,''));
  }
  if (typeof rval !== 'number' || Number.isNaN(rval)) {
    rval = 0;
  }
  return rval;
}



var testString = 'a23,3.65$b';

console.log('Original intVal result:',intVal(testString));
console.log('Modified safeIntVal result:',safeIntVal(testString));

旁注

您可以在data函数内声明一个footerCallback变量，该变量隐藏了传递给回调的同名参数。此外，total和pageTotal变量看起来像隐式全局变量（声明时没有使用var关键字）。