title: jquery datatable server side processing with both input and column filtering
body: <p>I am not good at javascript and I want to know how to filter the columns in datatable with both input and column filtering using PHP.</p>
  
  <p>I can only filter by input. But, I can't do both.</p>
  
  <p>Here is my working code with input server side filtering.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;table id="example" class="table table-hover"&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th&gt;ID&lt;/th&gt;
                  &lt;th&gt;Username&lt;/th&gt;
                  &lt;th&gt;First Name&lt;/th&gt;
                  &lt;th&gt;Last Name&lt;/th&gt;
                  &lt;th&gt;Status&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
  
          &lt;tfoot&gt;
              &lt;tr&gt;
                  &lt;th&gt;ID&lt;/th&gt;
                  &lt;th&gt;Username&lt;/th&gt;
                  &lt;th&gt;First Name&lt;/th&gt;
                  &lt;th&gt;Last Name&lt;/th&gt;
                  &lt;th&gt;Status&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/tfoot&gt;
      &lt;/table&gt;
  </code></pre>
  
  <p><strong>jQuery</strong></p>
  
  <pre><code>$(document).ready(function() {
              $('#example tfoot th').each( function () {
                  var title = $('#example thead th').eq( $(this).index() ).text();
                  $(this).html( '&lt;input type="text" placeholder="Search '+title+'" /&gt;' );
              });
  
              var table = $('#example').DataTable({
                  "processing": true,
                  "serverSide": true,
                  "order": [
                      [0, 'desc']
                  ],
  
                  "ajax": "server_processing.php"
              });
  
              table.columns().every( function () {
                  var that = this;
  
                  $( 'input', this.footer() ).on( 'keyup change', function () {
                      if ( that.search() !== this.value ) {
                          that
                          .search( this.value )
                          .draw();
                      }
                  });
              });
  });
  </code></pre>
  
  <p><strong>PHP</strong></p>
  
  <pre><code>&lt;?php
  
  // DB table to use
  $table = 'test_table';
  
  // Table's primary key
  $primaryKey = 'id';
  
  $columns = array(
      array( 'db' =&gt; 'id', 'dt' =&gt; 0 ),
      array( 'db' =&gt; 'username', 'dt' =&gt; 1 ),
      array( 'db' =&gt; 'firstname', 'dt' =&gt; 2 ),
      array( 'db' =&gt; 'lastname', 'dt' =&gt; 3 ),
      array(
          'db' =&gt; 'status',
          'dt' =&gt; '4',
          'formatter' =&gt; function($d, $row) {
              if($d == 1) {
                  return 'Success';
              } else if($d == 2) {
                  return 'Pending';
              } else {
                  return 'Fail';
              }
          }
      ),
  );
  
  // SQL server connection information
  $sql_details = array(
      'user' =&gt; 'root',
      'pass' =&gt; '',
      'db'   =&gt; 'testdb',
      'host' =&gt; 'localhost'
  );
  
  
  /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
      * If you just want to use the basic configuration for DataTables with PHP
      * server-side, there is no need to edit below this line.
      */
  
  require( 'ssp.class.php' );
  
  $result = SSP::simple($_GET, $sql_details, $table, $primaryKey, $columns);
  
  echo json_encode($result);
  </code></pre>
  
  <p>ssp.class.php is supported in datatable forum.</p>
  
  <p>Thanks a lot in advance. Please answer my question.</p>