Skip to content Skip to sidebar Skip to footer

How To Add Search To Some Individual Columns Of Datatable In The Footer?

I need to add filtering of different types (textbox, dropdown) to some(!) individual columns in DataTable to the footer. That is, I want to be able to search by a single column for

Solution 1:

You need to do two things here.

  • Add a tfoot to your table so it will have a space to add it
<tableid="example"class="display"cellspacing="0"width="100%"><thead><tr><th>First name</th><th>Last name</th><th>Position</th><th>Office</th><th>Salary</th></tr></thead><tfoot><tr><thcolspan="4"style="text-align:right">Total:</th><th></th></tr></tfoot><tbody><tr><td>Tiger</td><td>Nixon</td><td>System Architect</td><td>Edinburgh</td><td>$320,800</td></tr></tbody></table>
  • Use footerCallBack like specified here http://datatables.net/examples/advanced_init/footer_callback.html You also used columns instead of column.

     $(document).ready(function() {
          $('#example').DataTable({
          "footerCallback": function ( row, data, start, end, display ) {
              var api = this.api(), data;
              $(api.column(1).footer()).html("test text");
           }
          });
      });
    

Post a Comment for "How To Add Search To Some Individual Columns Of Datatable In The Footer?"