[SOLVED] Datatable row count not working with search result

Datatable row count not working with search result

In the view the code is working fine and showing me the count and result. Also on search. However when I search any word I want that count according to the search result but in my case its showing me total count of the all price fields. It's not showing the current search result count. Can anyone please help me?

My Datatable code for custom search and count of last two fields:

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

Solution

Make sure to set search: 'applied' in the selector-modifier of the column method.

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

You are also calling the sum only once after the inital draw. Move the call to sum to the drawCallback. Below is an example:

$.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>