Set Color using database attribute

0
Hello everyone. I’m using Mendix 9.2.0 and I need help with this scenario: - I have an entity called ‘Servico’ with an attribute ‘Color’ that holds a string representing the color  (by hexadecimal) - When creating a new ‘Servico’, I’m picking a color and storing the hexadecimal string in the attribute color I need to show a list of ‘Servico’ and each ‘Servico’ has its color. So, the problem is, how can I set the color of each ‘Servico’ since I choose its color when I create it? Is there a way to create like a function to receive a string(color hexadecimal) and set the container’s color according to each ‘Servico’ ? How can I set the color without predefining it in CSS classes?   Each Service has its color, like this:  Thanks in advance!
asked
5 answers
1

Hi Daniel,

Follow the below steps for your expected result

1)Download javascript snippet

2)Add javascript snippet to the listview

3)Configure the Data source of javascript snippet 

4)Enable the options jquery and refresh options and include the javascript code

Javascript Code

if(refresh){
$(this.domNode).empty();
}
$(this.domNode).append(`<p style='background-color:${Color}'>${Name}</p>`);

 

5)Here is the result

Thanks

Vignesh G

answered
0

 

hard one: For me i will build a custom list in react with rendering the box detail inside. 

 

easy one: mendix grid + https://marketplace.mendix.com/link/component/106254

 

cheers

answered
0

Hi Daniel,

 I find a better way for you to Set Color using database attribute. 

First, install the module form app store: css Selector helper widget

Second: use the widgets and set attribute like below image

Finally, You will get the following effect。

So, Try it!!!

answered
0

If you’re comfortable with a bit of HTML and only need light elements, you could use the Format String widget (https://marketplace.mendix.com/link/component/264) – despite it’s name it is a great way to quickly render HTML elements with custom styling/attributes.

answered
-1

Hi daniel , 

In the container appearance section we have option called dynamic classes which will help you to achieve your cases

answered