Forum Academy Marketplace Showcase Pricing Features

Change checkbox to checked when image is clicked

When clicking on an image, i’d like to switch a checkbox to checked, or unchecked.

How can I do this easily?

Hi there, @zayn… if you are just looking to toggle a checkbox when an image is clicked, one way you can go about it is with a custom state. So, if you have a yes/no custom state on the page, you could have two workflows associated with clicking the image… one that sets the value of the custom state to yes only when the checkbox isn’t checked, and one that sets the value of the custom state to no only when the checkbox is checked. Then, you would add a condition to the checkbox element that says when the custom state is yes, the preset status of the checkbox is checked.

I did a quick test of what I have written above, and it does seem to produce the desired result, if I have understood your post correctly. Hope this helps.


Thanks Mike, i’m still struggling with adding a custom state to the page, and then connecting it to a condition of the checkbox.

Can you point me at any tutorials in this area?


You can do one workflow step which is agnostic to whether the box is checked or not, by changing the field value of the yes/no field to the “field’s is no”

No messing about with multiple steps that way

This is not going to work.

Note that in your workflow’s step 1 you change it to CHECKED (if it is unchecked) and just after, you will allways change it back to UNCHECKED (because in step 1 you change it to checked).

Furthermore, workflows are asynchronous, so the steps will not always run in order…

You just need one step to change your custom state, with the bellow as value:

image checkbox isn't checked

Don’t put anything in your “Only when” field.


The value will be a result of a verification, where the answer will always be YES or NO.

So imagine that your checkbox is CHECKED. When you run the verification above, the result will be NO. Because de affirmation is false. If the result is NO, your custom state will change from YES to NO.

Now imagine that your checkbox is UNCHECKED. When you run the verification above, the result will be YES. Because de affirmation is true. If the result is YES, your custom state will change from NO to YES

Hope it helps @zayn

I see what you’re saying, but I did test it, and it works exactly as expected… when you click the image the first time, the checkbox is checked, and when you click the image again, the checkbox becomes unchecked.

Edit: I deleted my post with the screenshots because although it appears to work, I’m not entirely sure why it works, and I don’t want to send anyone down the wrong path.

I did the set you you had @mikeloc for a similar logic and ran in to the issue that people are saying above. I think the first click it would run as expected but any resultant click it would run in to the issue.

How I fixed it was put the ‘only when’ on the WF itself not the step. So instead of one WF with 2 steps I had 2 WF’s (with conditionals) with one step each. This solved it for me :slight_smile:

But I do like @rpetribu solution above as its much cleaner and more elegant - I’ll be filing this away for when I need the logic again :slight_smile:

1 Like

Yup, I get what you folks are saying, but I sat there at one point and clicked the image probably 50 times, and it toggled the checkbox appropriately every single time. I wonder why it seems to work as expected for me when it really doesn’t look like it should. That being said, I’m sure your solution, @equibodyapp, or @rpetribu’s are better ways to go, and I’m guessing @zayn won’t have any trouble making progress given those options.