Hi may i ask if it possible to put a if statement in css?
I want to show the input filed if it has data the background color will change it gray color
so it add a if statement in the css,
but it doen't change.
Do i did things wrong?
Thank you
Hi eva wong,
Use the Expression Editor provided by Outsystem for such kind of requirement:
1- Goto Style Classes -> Expression
2- Add If condition as per you requirement & declare classes to be applied
if( Condition , "Name of Classes When condition True","Name of Classes When condition False")
3- The CSS will be applied dynamically based on condition result to the Input Widget
If(True,"form-control backgorund-grey","form-control")
Thanks
Hi
It is not possible to have an if condition in the CSS.
However OutSystems recommends the use of expressions in the Style Classes property.
The above is the best practice recommended by OutSystems.
To know more such best practices, check out the link
https://success.outsystems.com/Documentation/Best_Practices/The_Complete_Guide_to_Creating_Components
Dear Eva,
You cant have an if statement directly on CSS. However, you can achieve what you are looking for using the below technique. Track the input:placeholder-shown on CSS and you can toggle the styles based on the presence of input data. Check the screenshot below and try to implement on your solution.
input:not(:placeholder-shown)
Have a nice day.