DataTables

DataTables Examples

HTML

<link rel="stylesheet" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css">
<script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.js"></script>
<table id="example">
  <thead>
    <tr>
      <th>Seq.</th>
      <th>Name</th>
      <th>Make</th>
      <th>Model</th>
      <th>Status</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td>1</td>
      <td>Tiger Nixon</td>
      <td>Sony</td>
      <td>Vaio Q900</td>
      <td>Inactive</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Jom Jones</td>
      <td>Dell</td>
      <td>Esprimo Q6000</td>
      <td>Inactive</td>
    </tr>
    <tr>
      <td>3</td>
      <td>Sarah Black</td>
      <td>Dell</td>
      <td>S23235</td>
      <td>Active</td>
    </tr>
    <tr>
      <td>4</td>
      <td>Pete Smith</td>
      <td>Apple</td>
      <td>Mac Mini</td>
      <td>Inactive</td>
    </tr>
  </tbody>
</table>

JavaScript

var table = $('#example').DataTable();

$('.dataTables_filter input').unbind().bind('keyup', function() {
   var searchTerm = this.value.toLowerCase(),
       regex = '\\b' + searchTerm + '\\b';
   table.rows().search(regex, true, false).draw();
})