I want to use conditional formatting with a hidden column. But as soon as I hide the column, the "conditional formatting" no longer works.
I've also tried it with css. So the column is shown and set to "disabled-none" with CSS. Then it works for desktop browsers. However, this does not work for mobile views. The row with the "css row-details" class then gets a colspan="" with one column too many.
When you turn off the "Visible on front-end" slider, the column is not loaded on the front-end, so the conditional formatting rule has nothing to be applied on.
You would, however, be able to add a custom CSS class to this column "hide", and without the need of manually adding any custom CSS, the column would be hidden from the table:
Unfortunately my site is still not online. But you can easily reproduce that. Simply style a column "hide" and build a responsive table. Then reduce the screen so that the values jump into the detail line.
We could not replicate this. Not with setting the class of the column in Column Settings, nor with adding the conditional formatting to set the class "hide" for any condition.
This brings me to the conclusion that maybe your theme or another plugin has a stronger selector, so it's displayed. Can you inspect the page and see if that column has the class "hide" like it's configured in row details when all hidden columns are expanded?
This is caused by the library that we use. It is being changed dynamically, and we can't include any custom CSS that would override this behavior. The colspan (as you said) picks up the hidden column and only some custom JS would be able to override it.
Either that or using a fixed value in the library, but that would fix the colspan to a certain value, and I'm not sure if that would work for you.
Unfortunately, this can't be achieved easily since it's being done by another library. A custom solution would have to be implemented here, but unfortunately, we do not provide custom solutions like this. If we had done anything similar in the past, I would've gladly sent it to you.
I can see that Milos escalated the issue to our developers. As soon as we hear from them, he'll let you know.
I apologize for the delay, but at this time there's no way we can speed it up. I'm not aware as to why "highlight" is not being recognized, so we'll have to wait for our developers.
I want to use conditional formatting with a hidden column. But as soon as I hide the column, the "conditional formatting" no longer works.
I've also tried it with css. So the column is shown and set to "disabled-none" with CSS. Then it works for desktop browsers. However, this does not work for mobile views. The row with the "css row-details" class then gets a colspan="" with one column too many.
Do you have an solution for that?
Best regards
Jens
Hi again Jens.
When you turn off the "Visible on front-end" slider, the column is not loaded on the front-end, so the conditional formatting rule has nothing to be applied on.
You would, however, be able to add a custom CSS class to this column "hide", and without the need of manually adding any custom CSS, the column would be hidden from the table:
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hi Aleksandar,
hiding works, but the table is no longer displayed correctly in the mobile view. The detail row (colspan) continues to span all columns.
Hi again Jens.
Can you send me the link to the page where this happens?
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hi Alekandar,
Unfortunately my site is still not online.
But you can easily reproduce that. Simply style a column "hide" and build a responsive table.
Then reduce the screen so that the values jump into the detail line.
Best regards
Jens
Hi again Jens.
We could not replicate this. Not with setting the class of the column in Column Settings, nor with adding the conditional formatting to set the class "hide" for any condition.
This brings me to the conclusion that maybe your theme or another plugin has a stronger selector, so it's displayed. Can you inspect the page and see if that column has the class "hide" like it's configured in row details when all hidden columns are expanded?
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hi Aleksandar,
I could reproduce this in your demo-version. Table - Employees (Editable, Responsive)
Step 1: set column "Lastname" CSS on hide.
Step 2: open the table and resize the window until you see the "+" icon.
Step 3: open the resize table .... the result should be the same hopefully
Best regards
Jens
I see, Jens, thanks for that.
This is caused by the library that we use. It is being changed dynamically, and we can't include any custom CSS that would override this behavior. The colspan (as you said) picks up the hidden column and only some custom JS would be able to override it.
Either that or using a fixed value in the library, but that would fix the colspan to a certain value, and I'm not sure if that would work for you.
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hi Aleksandar,
a fix colspan is not an option for me because I usea lot of different tables.
How about when calculating the colspan you look for the css style "hide" and subtract it from the colspan?
Does that sound good?
If that is not possible, then I need an alternative solution. please refer ->
https://tmsplugins.ticksy.com/ticket/3048893/
Kind regards
Jens
Hi again Jens
I don't know if this can be achieved, but I'll forward your idea to our developers.
I'll get back to you when they respond.
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hi again Aleksandar,
thank you for your support. :-)
Best regards
Jens
Jens, I just wanted to let you know that we didn't forget about you.
Our developers are away on a WordCamp conference in Porto, so their access is limited. As soon as I hear from them I'll get back to you.
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hi again Jens
I just received info from our developers.
Unfortunately, this can't be achieved easily since it's being done by another library. A custom solution would have to be implemented here, but unfortunately, we do not provide custom solutions like this. If we had done anything similar in the past, I would've gladly sent it to you.
Sorry for the inconvenience.
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hello Aleksandar,
that's a pity but not so bad as long as you find a solution for my alternative solution (https://tmsplugins.ticksy.com/ticket/3048893/).
I still see this as a bug because otherwise you can never hide a column via css.
@Aleksandar can you try to give my other ticket 3048893 a high priority? So that I have an alternative solution?
Best regards
Jens
Hey Jens.
I can see that Milos escalated the issue to our developers. As soon as we hear from them, he'll let you know.
I apologize for the delay, but at this time there's no way we can speed it up. I'm not aware as to why "highlight" is not being recognized, so we'll have to wait for our developers.
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables