Replies

• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  August 2015

  I want to set all the search boxes out of the table and at the top. It's possible ?

  Yes - use dom.

  See this example.

  Allan
• johngtrs Posts: 33Questions: 2Answers: 0

  August 2015

  Thanks for your answer.

  When I use "f" I can move the filter input but I can't move the filters input below each column.
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  August 2015

  Oh I see. For the individual column filters, you would just modify the code shown in the example to insert into the header, or wherever you want them to appear, rather than into the footer as they are in that example.

  Allan
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  August 2015

  You might also be interested in this example which shows column filters outside of the table.

  Allan
• johngtrs Posts: 33Questions: 2Answers: 0

  August 2015 edited August 2015

  Thanks allan your answer are always amazing.

  But with that it's possible to get something like that ?

  filter input | filter input |
  
  |    title1     |     title2     |     title3   |     title4   |
  
  

  Do you see ? And I want to disable the filters input on the 2 last columns.
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  August 2015

  Certainly possible, the code just needs to be suitably modified. Probably the easiest way is to use something like the same I linked to above, whereby you have the input elements in the page already and then just add suitable event listeners.

  Allan
• johngtrs Posts: 33Questions: 2Answers: 0

  August 2015

  Ok thanks. I'll try this but it seems really hard :p
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  August 2015

  $('#myInput1').on( 'keyup', function () {
    myTable.column( 0 ).search( this.value ).draw();
  } );
  

  Not hard at all ;-)

  Allan
• johngtrs Posts: 33Questions: 2Answers: 0

  August 2015

  I'm using :

        function filterColumn ( i ) {
            $('#idtable').DataTable().column( i ).search(
                $('#col'+i+'_filter').val()
            ).draw();
        }
         
        $(document).ready(function() {
            $('#idtable').dataTable();
         
            $('input.column_filter').on( 'keyup click', function () {
                filterColumn( $(this).parents('tr').attr('data-column') );
            } );
  

  but I can't put the filters input below the "show x entries" :/
• johngtrs Posts: 33Questions: 2Answers: 0

  August 2015

  The problem is that the filters input are out the table. Can I put this filters input just above my title and in my table ?
• johngtrs Posts: 33Questions: 2Answers: 0

  August 2015

  Ok it works ! Thanks again Allan.