Adding a state definition to a button

[Janicen]

Hello everyone,

I hope you are well.

I want to create a service that changes the value of a property. This service takes in an input (true or false) which is then assigned to the property's value. 

I want to use the button to accomplish this. Meaning only when I click the button will I get either a true or false value. This will cause the property to change value whenever the button is clicked.

The problem is buttons do not take in state definitions (Where I planned to keep the true/false). 

How else can I accomplish this?

Your suggestions will be much appreciated.

Regards.

[Janicen]

I managed to do this using a service. 

In my service, I used a conditional statement to check the current value of the property and then assigned the property a new value.

Now I am looking to change the color of the button depending on the property value (either true or false).

Is it possible to do this using an expression?

Best Regards.

[jensc · Accepted solution]

Hello,

You could use an expression to set your buttons custom css class dependent on your boolean value.

So maybe something like this: 

if (true) {
 result = myButtonClass1
} else {
 result = myButtonClass2 
}


Put these in the Custom CSS tab

and then bind the custom CSS input on your button to the result of your expression.

.myButtonClass1 .widget-ptcsbutton {
    background-color: red !important;

}

.myButtonClass2 .widget-ptcsbutton {
    background-color: green!important;

}

Hope this helps.