Add dynamic CSS class to Table Cell based on Entity Attribute Value

1
I like to change the Table Cell CSS-property with a value based on the corresponding Entity Attribute value. In other thread I read to use the Visibility Rules of a row or cell, but the table is too complex to achieve with this feature. So are there any ideas to solve this problem ?
asked
5 answers
2

Maybe this widget works for you: CSS selector helper widget

There is a context sensitive version that allows you to use an attribute value as CSS selector. Put the table inside a Container that has this widget and you can use CSS selectors to find the cell. You might need to put a CSS class on the cell to target that cell only rather than each cell in the table.

answered
1

Hi Michel. I use css selectors when the mendix table generates a title attribute. For example, if the attribute value is 'Very Low' the cell is displayed with a blue background:

.mx-name-name td[title="Very Low"] {
  background: lightblue !important;
}

Is this perhaps what you're looking for?

answered
0

You should create your own widget to achieve this functionality.

answered
0

all thanks for the answers, but it not exactly what I meant. Eg. I have the following table setup

-table-

-tr- -td-record1 -td- -td class="status"- open -td- -tr-

-tr- -td-record2 -td- -td class="status"- closed -/d- /tr-

-/table-

In the BM I can give table cells the default class "status". As MX renders the pages, all table-data cells for status contains the class "status". But the actual value of the underlaying record, with status database-entity-attribute-names value open or closed, If that value is "open", then the class must be changed from "status" to "xyz1", when value is "closed" then the class must be "xyz2"

so at the end it must look like -table-

-tr- -td-record1 -td- -td class="xyz1"- open -td- -tr-

-tr- -td-record2 -td- -td class="xyz2"- closed -/d- /tr-

-/table-

answered
0

Please check the Data grid extension

https://appstore.home.mendix.com/link/app/877/Flock-of-Birds/Data-Grid-Extension-(Flex-Headers)

At the widget configuration, In the tab row, it is possible to select an attribute that the value, will be added as a class in the row of the grid.

So it s not placed on the cell inself, if you have only one cell the change color you can use CSS selector to change te color of a single cell

Check the sample project: https://github.com/Andries-Smit/DataGridExtention/tree/master/test

answered