[数据表搜索具有Footer回调以求和列货币的个人

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

我试图通过Footer回调添加到表搜索个人中以求和货币,但我无法编写正确的代码。

html

<table id="example">
<thead>
    <tr>
        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
        <th>price</th>
    </tr>
</thead>
<tfoot class='footer'>
    <tr>
        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
        <th>price</th>
    </tr>
</tfoot>
<tfoot class='custo'>
  <tr >
      <th colspan=5 style=text-align:right>Total:</th>
      <th></th>
  </tr>
</tfoot>
<tbody>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 4.0</td>
        <td>Win 95+</td>
        <td> 4</td>
        <td>X</td>
        <td>R$ 1.000,00</td>
    </tr>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 5.0</td>
        <td>Win 95+</td>
        <td>5</td>
        <td>C</td>
        <td>R$ 2.000,00</td>
    </tr>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 5.5</td>
        <td>Win 95+</td>
        <td>5.5</td>
        <td>A</td>
        <td>R$ 500,00</td>
    </tr>
</tbody>

JS

/* add input text for table  footer */
$('#example tfoot.footer th').each( function () {
 var title = $(this).text();
 $(this).html( '<input type=\"text\"/>' );
});
/* add the sum of currency */                   
var table = $('#example').DataTable({
 // code for footerCallback goes here but its not working 

 'footerCallback': function ( row, data, start, end, display ) {
   var api = this.api(), data;
   var intVal = function ( i ) {
     return typeof i === 'string' ?
      i.replace(/[\R$,]/g, '')*1 :
      typeof i === 'number' ?
          i : 0;
 };
total = api
  .column( 5 )
  .data()
  .reduce( function (a, b) {
      return intVal(a) + intVal(b);
  }, 0 );
pageTotal = api
  .column( 5, { page: 'current'} )
  .data()
  .reduce( function (a, b) {
      return intVal(a) + intVal(b);
  }, 0 );
$( api.column( 5 ).custo() ).html(
  '$'+pageTotal +' ( $'+ total +' total)'
 );
}




});
/* make the search indvidual when keyup change. */
table.columns().every( function () {
 var that = this;
 $( 'input', this.footer() ).on( 'keyup change', function () {
    if ( that.search() !== this.value ) {
        that
            .search( this.value )
            .draw();
    }
 });
});

这里没有总和的示例:http://jsfiddle.net/minamagdy666/e88yrhaj/13/

我要在该链接上用于总和货币的示例:enter link description here

谢谢

javascript search datatables sum
1个回答
0
投票

做这个例子:

© www.soinside.com 2019 - 2024. All rights reserved.