Do not display column but want to have that column searchable

Hi Kevin,

thanks for your question.

Yes, hiding a column but keeping it searchable is possible with an extra command for the DataTables JavaScript library. Please add this to the “Custom Commands” textfield on the “Edit” screen of the table:

"aoColumnDefs": [ { "bVisible": false, "aTargets": [ 5 ] } ]

The 5 indicates, that the sixth column will be hidden (counting starts with 0), so adjust that as necessary.

About the Inverted Search Extension: This happens because it takes a little time for the JavaScript code to run and to hide the table.
Unfortunately, I don’t really know a good solution to this, but you could try to hide it with CSS first (as that will be applied instantly), and then show it (or actually what remains of it after the Extension runs) again after a small delay.
The CSS code for that would be

.tablepress-id-123 {
  display: none;
}

and it would go into the “Custom CSS” textarea on the “Plugin Options” screen.
The extra JS code could be

<script>
jQuery(document).ready( function($) {
  setTimeout( function() { $('#tablepress-demo').show(); }, 500);
} );
</script>

and should go below the table’s Shortcode in the page content (with an empty line between it and the Shortcode).
The 500 indicates 500 milliseconds, so you might want to play with that.

Regards,
Tobias

Hi TobiaBg,

Thanks for your help. The CSS worked perfect to hide the table as it loads.

I did have a quick question though. After I hid the column using the custom command so that the column is searchable but hidden, the header of the table does not extend to the edge of the page. It looks like the header would go to where the hidden column would be and stops there. Is there a way to override so the header (background color) extends to the edge of the page like it did without a hidden column?

Thanks again for the CSS to hide the table loading. It looks great now.

Hi,

good to hear that the CSS worked!

Now, I’m not exactly sure why the header now does not extend. My assumption actually is that this is related to the initial hiding of the table, as that could mean that the JS can not properly determine and set the column widths.
Thus, you’ll probably just have to set the column widths manually, as explained in the answer to the question “How can I set column widths?” in the TablePress FAQ at https://tablepress.org/faq/

Regards,
Tobias