Change background color of button on click

Ask us anything How do I?
1

I am looking to create a button which, when clicked, changes the background color and text color of the button itself.

The idea is to signify to the end-user that the button has been activated.

How can I achieve this?

2

Hi @speedymua :wave:

You could go about it this way:

  • create a clicked variable of “Boolean” type that is false by default
  • add a clicked state on the button
  • bind the condition of the clicked state to the clicked variable
  • when the user clicks on the button, trigger a workflow that updates the clicked variable to true

Style the button and text differently when the state is the default state or the clicked state.

Here’s a video that explains how to add custom states in WeWeb.

Does that help?

3

Hey @Joyce,

Sorry for a shameless dig out.
How would one go about changing the ‘clicked’ style of a dynamically rendered item coming from a collection? I have a list of items, styles should go back to its normal state when the other item is clicked and so on.

Thanks in advance!