Answers

• kthorngren Posts: 20,300Questions: 26Answers: 4,769

  February 2020

  Among other things this thread discusses this issue and another that I think you have. The other is if you hide a column the searches don't apply to the correct column. For example with all the columns visible searching for 64 in the Erzielte Tore column works. Hide Saison and now searching for 64 doesn't work. But if you search for 28 it finds the first row since it is actually searching the Spiele column.

  For the issue you posted look for my example using the column-visibility event. For the second issue look for the answer with $(this).parent().index()+':visible'.

  Kevin
• RoloTomasi Posts: 18Questions: 9Answers: 0

  February 2020

  Indeed there were two issues.
  With adding of $(this).parent().index()+':visible' part I was now able to search for the values, which belong to the head above.
  But with the column-visibility Event I was not able to implement to make colums searchable, when not visible by default. I'm not deep enough in JQuery.
• kthorngren Posts: 20,300Questions: 26Answers: 4,769

  February 2020

  This code didn't work for you?

    // When a column becomes visible add the input in case it was initially hidden by stateSave
    $('#example').on( 'column-visibility.dt', function ( e, settings, column, state ) {
  
      // Column changed to visible
      if ( state ) {
        
        // Get the second row TH
        var rowTwoTH = $(table.column( column ).header()).parent().next().find('th:eq(' + column + ')');
        
        // Add input if calls is filterhead
        if ( $(rowTwoTH).hasClass('filterhead') ) {
          var title = $(table.column( column ).header()).text();
          $(rowTwoTH).html( '<input type="text" placeholder="Search '+title+'" class="column_search" />' );
        }
      }
      
    } );
  

  Do you get errors? What happens? Can you update my example or create your own or provide a link to your page so we can take a look?

  Kevin
• RoloTomasi Posts: 18Questions: 9Answers: 0

  March 2020

  Thank you. It works. I just put the part you posted underneath my code.
  https://jsfiddle.net/RoloTomasi/uqyrbv8h/29/
  I was a little bit frightened, because there is so many other code, which - I thought - didn't fit to that and I cannot easily alter it anymore.
  But now I've two more challenges.

  The first one is that only the columns next to the column which is visible by default becomes searchable. If I chosse the next but one column, it has no effect anymore.

  The second one is that it is not really responsive anymore. I tried to play with responsive-resize, but not successful.

  Regards Thilo