数据表行计数不适用于搜索结果

时间:2018-02-21 09:17:06

标签: javascript jquery datatable datatables datatables-1.10

在视图中,代码工作正常并向我显示计数和结果。也在搜索。然而,当我搜索任何单词时,我希望根据搜索结果计算,但在我的情况下,它显示所有价格字段的总数。它没有显示当前的搜索结果计数。有人可以帮帮我吗?

我的自定义搜索的数据表代码和最后两个字段的计数:

$(document).ready(function() {
    var table = $('#example').DataTable({
        "scrollX": true,
        "bLengthChange": false,
        dom: 'Bfrtip',
        buttons: [{
        extend: "excel",
        className: "darse"
    },{
        extend: "print",
        className: "ddf"
    }]
});

1 个答案:

答案 0 :(得分:2)

请务必在selector-modifier方法的column中设置search: 'applied'

$('<p>' + table.column(6, {
    page: 'current',
    search: 'applied'
}).data().sum() + '</p>').prependTo('#demo');

在初次抽签后,你也只召集一次金额。将呼叫移至总和drawCallback。 以下是一个例子:

$.fn.DataTable.Api.register('column().data().sum()', function() {
  return this.reduce(function(a, b) {
    var x = parseFloat(a) || 0;
    var y = parseFloat(b) || 0;
    return x + y;
  }, 0);
});

$(document).ready(function() {
  var table = $('#example').DataTable({
    "bLengthChange": false,
    dom: 'Bfrtip',
    drawCallback: function(settings) {
      var api = this.api();
      $('<p>' + api.column(1, {
          page: 'current',
          search: 'applied'
      }).data().sum() + '</p>').prependTo('#demo');
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet"/>
<span id="demo" />
<table id="example">
  <thead>
    <tr>
      <th>Text</th>
      <th>Number</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th>Text</th>
      <th>Number</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>Alpha</td>
      <td>3</td>
    </tr>
    <tr>
      <td>Beta</td>
      <td>4</td>
    </tr>
    <tr>
      <td>Gamma</td>
      <td>8</td>
    </tr>
    <tr>
      <td>Delta</td>
      <td>5</td>
    </tr>
  </tbody>
</table>