title: Edit jQuery dataTables info
body: <p>I am using <a href="https://datatables.net/" rel="nofollow noreferrer">Jquery Data table</a> to present my table. I have a column which has record as Active or Inactive. Now I want to display count of number of column which has value active &amp; inactive right after where it shows Showing 1 to 10 of 72 entries.</p>
  
  <p>My table like like this
  <a href="https://i.stack.imgur.com/df1AE.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/df1AE.jpg" alt="enter image description here"></a></p>
  
  <p>Jquery</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
          $(document).ready(function () {
              $('#example').dataTable({
                  "bLengthChange": true,
                  "paging": true,
                  "sPaginationType": "full_numbers" ,                    //For Different Paging  Style
                  "scrollY": 400,                                     // For Scrolling
                  "jQueryUI": false,                                     //Enabling JQuery UI(User InterFace)
                  "lengthMenu": [[30, 50, 100, -1], [30, 25, 50, "All"]],
                  drawCallback: function (settings) {
                      var api = this.api(); 
                      // get the number of rows, but remove the page:current if you want number of rows in entire dataset
                      var count = api.rows({
                          api: $('#example tbody tr td[value="active"]')
                      }).data().length;
                      // this takes the count and appends it in a span tag to the dataTables pageinate div element
                      $('&lt;span id="active_rows"&gt;&lt;/span&gt;').html(count + ' rows').appendTo($('.dataTables_info'));
                  }
              });
          });
      &lt;/script&gt;
  </code></pre>