# Set state of button to unclickable

**URL:** <https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932>\
**Category:** Need help\
**Created:** [January 24, 2022, 4:33pm UTC](https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932 "2022-01-24T16:33:00Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![rowena1](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/rowena1/32/121367_2.png) [@rowena1](https://forum.bubble.io/u/rowena1)\
**Post date:** [January 24, 2022, 4:33pm UTC](https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932/1 "2022-01-24T16:33:01Z")

</div>

I’m fairly new to Bubble but have progress very well. I need help with the steps on creating a state that makes a button unclickable.

I will use this state to “deactivate” some buttons on my flow-steps. I couldn’t make states work. If someone can kindly show me a tutorial or direct me to a thread where there are instructions on how to do this specfically, I’d certainly appreciate it. Thank you.

---

<div class="post-metadata">

**Author:** ![mikeloc](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/mikeloc/32/93001_2.png) [@mikeloc](https://forum.bubble.io/u/mikeloc)\
**Post date:** [January 24, 2022, 4:49pm UTC](https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932/2 "2022-01-24T16:49:08Z")

</div>

Hi there, @rowena1… there is a ton of good content out there on custom states, so do some googling and check that stuff out because understanding custom states is an important part of building apps on Bubble.

The above being said, here is a simple example of what you described. I added a custom state (yes/no) called `button deactivated` to the index page (you can add the state to any page/element you want, of course).

 ![state1](https://us1.discourse-cdn.com/bubble/original/3X/3/d/3dd1447d252388d0ddaafc623a1f189e87b6fcba.png)

You change the custom state using this workflow action (ignore that I am using the _Page is loaded workflow_… it’s just for the example).

 ![state2](https://us1.discourse-cdn.com/bubble/original/3X/f/6/f6c6bb23f1f8ab5bd97f8bd012b8e0e3e800f474.png)

The workflow action would look like this…

 ![state3](https://us1.discourse-cdn.com/bubble/original/3X/e/6/e6bde872ec04e1bd822b61f1fd9ee780bf27615e.png)

Finally, you would add a condition to the button that looks like the following, and that should produce the desired result of having the button become unclickable when the custom state is set to a certain value.

 ![state4](https://us1.discourse-cdn.com/bubble/original/3X/a/1/a1cf13053a5483a8eb8ff2f7f98a641c91e14a5a.png)

Hope this helps.

Best…  
Mike

---

<div class="post-metadata">

**Author:** ![rowena1](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/rowena1/32/121367_2.png) [@rowena1](https://forum.bubble.io/u/rowena1)\
**Post date:** [January 24, 2022, 5:08pm UTC](https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932/3 "2022-01-24T17:08:32Z")

</div>

Thanks @mikeloc ! Does it matter that you used the trigger “This button is hovered”? Essentially, I have 5 steps. So when the user is on the second step (ie button 2), I want button 1 to be deactivated entirely so he doesn’t go back to the sub-steps under Step 1. What I did is to make Button 1 unclickable when the group on Step 2 is visible but I think it’s more appropriate to use states. Here’s my app draft : [https://scale-celery.bubbleapps.io/version-test/dashboard](https://scale-celery.bubbleapps.io/version-test/dashboard)

---

<div class="post-metadata">

**Author:** ![mikeloc](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/mikeloc/32/93001_2.png) [@mikeloc](https://forum.bubble.io/u/mikeloc)\
**Post date:** [January 24, 2022, 5:11pm UTC](https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932/4 "2022-01-24T17:11:31Z")

</div>

I didn’t use _This button is hovered_… that’s a default condition on a button that changes the look of the button when a user hovers over it. The condition I created is below that one.

> [@rowena1](#):
>
> What I did is to make Button 1 unclickable when the group on Step 2 is visible

There is nothing wrong with doing it that way, by the way. Also, as you may or may not know, custom states get reset when the page is refreshed, so you may want to consider a more “permanent” solution that makes buttons unclickable even when the page is refreshed.

---

<div class="post-metadata">

**Author:** ![bestbubbledev](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/bestbubbledev/32/116378_2.png) [@bestbubbledev](https://forum.bubble.io/u/bestbubbledev)\
**Post date:** [January 24, 2022, 5:13pm UTC](https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932/5 "2022-01-24T17:13:18Z")

</div>

You could simply use Conditions for this. **When** “certain event happens” **Then** this button is not clickable.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/bubble/original/3X/2/8/2847faa74692c2ffa5d939d3dc3724cdd060d247.png) [@system](https://forum.bubble.io/u/system)\
**Post date:** [April 4, 2022, 4:33pm UTC](https://forum.bubble.io/t/set-state-of-button-to-unclickable/187932/6 "2022-04-04T16:33:35Z")

</div>

Closed on April 4, 2022, 4:33pm UTC

This topic was automatically closed after 70 days. New replies are no longer allowed.
