Show all hidden columns button when using filters

silkspin

I use a colvis group to toggle columns off/on which works fine. I use a function to clear the (drop-down) filters on a column before hiding. This is to prevent users being confused by being left limited data entries because of the hidden filtered column.

The problem I currently have is that it resets (drop-down) filters on columns that were not hidden when using the "show all columns" button I created. I’m not quite sure how to achieve my aim which is to leave the filter select value as it was if the column wasn’t hidden when the "show all columns" button was activated.

I’ve created a demo… http://live.datatables.net/fijotibe/1/edit

For example…

1.
Select Position > Director and Office > London
Column visibility > Position (to hide)
Column visibility > Position (to show)
This produces the correct result. The filter has cleared Position as required and Office is still has the value London.

2.
Leave Office > London selected and then…
Column visibility > Position (to hide)
Show All Columns
The Office filter value has been cleared but this isn’t what I wanted to happen

I’ve tried altering the code below without any luck...

// clear filter before hiding column
$('#example').on( 'column-visibility.dt', function ( e, settings, column, state ) {
  table.columns(column).search('').draw();

  table.columns([1,2])
          .every( function () {
    var idx = this.index('visible');
    if (this.search() === '' && idx !== null) {
      $('#example thead tr:eq(1) td:eq('+idx+') select').val('');
    }
  });
} );

I also wasn’t sure if the button action dt.columns([0,1,2,3,4,5]).visible( true, false ); might be the wrong way to make all the columns visible at once and is responsible for the already visible column’s filters being cleared. I have selected "false" which I assumed was to stop a redraw.

colin

Yep, you're clearing the value, so yep, when you unhide, it'll be cleared. You could store the values in an array, one for each column, and just reset to that value when unhidden in your event. That might be the simplest approach,

Colin

silkspin

Hi Colin. That is the behaviour I want for my columns as they are hidden. It’s the columns that aren’t hidden which get their filters cleared after clicking the show all columns button that’s causing me problems. I don’t know how to achieve this. Plan B is to just scrap the show all columns button which means my code will function ok but users will just have to show each column manually one at a time.

kthorngren

Colin might suggesting something like this:
http://live.datatables.net/bimoqiso/1/edit

Uses a global variable to get the original. colvis state in initComplete. It uses that stored state to determine whether to clear the select input. I took out a couple of your if statement conditionals. Not sure if they are needed with more columns. Will leave it to you to fully test this

Kevin

silkspin

Thanks for looking at this Kevin. Unfortunately I've done some testing and it isn't throwing up the correct results. I've run through a couple of examples...

1. (using colvis toggling)
   Select Position > Director and Office > London
Column visibility > Position (to hide)
   Column visibility > Position (to show)
   This produces the correct result. The filter has cleared Position as required and Office is still has the value London returning 13 entries.

2. (using the show all columns button)
   Select Position > Director and Office > London
Column visibility > Position (to hide)
   Show All Columns
   The filter has cleared Position as required and Office still has the value London but this filter isn’t applied and all 57 entries are shown again.

Is there a way of just the toggled off columns being shown when the show all button is pressed? The way the colvis function works seems to produce the correct results on an individual basis. I thought the button action higher up in the code might be the problem because it shows all 6 columns regardless of whether they were hidden or shown, but obviously the filter value is lost on columns already shown.

kthorngren

The filter has cleared Position as required and Office still has the value London but this filter isn’t applied and all 57 entries are shown again.

Right, you just need to add a condition to check to see if the column is visible or hidden:

        if ( !state ) {
          table.columns(column).search('').draw();
        }

http://live.datatables.net/bimoqiso/2/edit

Is there a way of just the toggled off columns being shown when the show all button is pressed?

You can use the columnsVisible array and get the indexes of the false columns (hidden columns).

Kevin

silkspin

That looks like the solution Kevin! So far I've not managed to break it

I'll do more testing tomorrow and integrate it into the more complex version I'm working on and report back. Thank you very much for you help.

silkspin

Hi Kevin. I've done loads of testing and can actually achieve my initial aim by just wrapping the line table.columns(column).search('').draw(); with the !state condition.

if ( !state ) {
  table.columns(column).search('').draw();
}

So, thank you once again for pointing out a fix!