How to add CSS styles to widget with microflow

1
Hi, I want to add CSS styles to widget using microflow. I want to achieve something like this, 'height:'+$value+';' for CSS style. How can I do this ? Thank you :)
asked
4 answers
2

Hi Putharin,

Yes this is possible:

Use a CustomString widget (render as html=true) and in the end event build up your string like:

'
<style>

.mx-name-nameOfYourElement
{
	height:'+$value+'px;
}

</style>

'

that should do the trick!

EDIT: Just wanted to add: be cautious in using these kinds of solutions, as they are terrible for maintainability: future developers/ops will have no idea where the styling is coming from. A better solution would be to alter the widget, add a microflow to the widget which retrieves a value at run time. The best solution however would be to don't do it: stay within the standard functionality of Mendix, and find an alternative solution to the problem / visual representation of the issue that does not require you to implement this :)

answered
2

Hi Phutharian,

There is no out of the box way to do this. You can play around with adding a style tag using javascript and the javascript snippet widget. This allows you to use object attributes as input parameters for your script.

https://appstore.home.mendix.com/link/app/43096/Incentro-Business-Acceleration/JavaScript-Snippet

 

Hope this helps!

 

answered
2

Unfortunately, it is not possible to do stuff like this in a microflow.

The only solution I can imagine is adding some custom javascript code to a html snippet that changes the style based on values you can find. (Or creating your own widget doing this)

answered
0

Hi Wieke,

Thanks for your answer, however please correct me if I did some step incorrectly.

This is the component that I want to adjust (the highlighted one).

This is my string at the end of event.

Also, it does appear right here when I inspect on it.

However, the size of the widget has not been adjusted at all.

I appreciate your assistance.

answered