How to use Conditional formatting on hidden columns?By Milan Jovanovic on 23/07/18 in

Unfortunately when you use option hide on frontend, that column will not be available in DOM of html and that is reason why conditional formatting is not working on hidden columns. What you can do is to turn on this option and then add this code in Custom wpDataTables CSS under the “Custom JS AND CSS” in main settings of wpdatatables.

table.wpDataTable thead tr th.column-newcolumn, table.wpDataTable tbody tr td.column-newcolumn{
display:none !important;
}

This will be affected on all tables, but if you want just for specific one then insert this code on page where is that table between the style tag.(<style>Code here</style>)

<style>
table.wpDataTable thead tr th.column-newcolumn, table.wpDataTable tbody tr td.column-newcolumn{
display:none !important;
}
</style>

where class column-newcolumn is generated class depends of name of your column name. You can check from Inspect element of the browser how this class is looks like for that column that you need to hide and replace it with this one. Like this column will be available in DOM of html, but will be hidden for users and conditional formatting will work.

Was this answer helpful ? Yes No

Comments are closed.