# Change action bouton after click

**URL:** <https://community.noloco.io/t/change-action-bouton-after-click/869>\
**Category:** Feature Requests\
**Tags:** feature-request\
**Created:** [June 20, 2024, 7:30am UTC](https://community.noloco.io/t/change-action-bouton-after-click/869 "2024-06-20T07:30:48Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![mpayre](https://avatars.discourse-cdn.com/v4/letter/m/f9ae1b/32.png) [@mpayre](https://community.noloco.io/u/mpayre)\
**Post date:** [June 20, 2024, 7:30am UTC](https://community.noloco.io/t/change-action-bouton-after-click/869/1 "2024-06-20T07:30:48Z")

</div>

HI.  
Would be interesting to change visualization (color+text) of action button after update  
(like in Airtable interface button).  
For example button “Begin” yellow color before update become “Finish” green color after click.

 ![action button](https://europe1.discourse-cdn.com/flex005/uploads/noloco/original/1X/6a221f7a5826fef277d2529a57f70e1d93fd9e45.jpeg)

---

<div class="post-metadata">

**Author:** ![darragh](https://dub1.discourse-cdn.com/flex005/user_avatar/community.noloco.io/darragh/32/12_2.png) [@darragh](https://community.noloco.io/u/darragh)\
**Post date:** [June 20, 2024, 9:33am UTC](https://community.noloco.io/t/change-action-bouton-after-click/869/2 "2024-06-20T09:33:13Z")

</div>

Usually we suggest having 2 buttons, presumably because they have 2 different actions, and then using [Visibility Settings](https://guides.noloco.io/account/pricing) to hide the button depending on the conditions

---

<div class="post-metadata">

**Author:** ![seanvosler](https://dub1.discourse-cdn.com/flex005/user_avatar/community.noloco.io/seanvosler/32/698_2.png) [@seanvosler](https://community.noloco.io/u/seanvosler)\
**Post date:** [June 20, 2024, 3:19pm UTC](https://community.noloco.io/t/change-action-bouton-after-click/869/3 "2024-06-20T15:19:28Z")

</div>

I just so happened to be working on this sort of thing right now

Quick overview of how I manage button/notification states in Noloco:

https://www.loom.com/embed/12f95500a80147ea8c0ae36a9f46d5d4?sid=b88ccd0a-2df8-4938-a7df-e9500447bf9a

_And a quick summary provided by loom hah:_

### Key Steps

1. **Identify Button Actions** : Determine the different actions that need to be associated with buttons based on specific triggers or conditions.
2. **Update Record Status** : Ensure that clicking on a button triggers the update of the record status to reflect the action taken.
3. **Set Visibility Rules** : Establish visibility rules for buttons based on the current status of the record or other relevant factors.
4. **Utilize Multi-Select Options** : Use multi-select options to define the different states and stages that will determine button visibility.
5. **Control Views** : Leverage stages and statuses to control the visibility of buttons and other elements on the page.
6. **Create Different Views** : Organize different views based on the various combinations of states and stages to effectively manage visual states.

### Cautionary Notes

- Ensure that the actions associated with buttons accurately reflect the changes in the record status.
- Double-check visibility rules to prevent buttons from showing or hiding incorrectly.
- Regularly review and update the stages and statuses to align with the workflow requirements.

### Tips for Efficiency

- Keep stages and statuses clear and organized to easily manage button visibility.
- Test button actions and visibility rules to confirm that they are functioning as intended.
- Document any changes made to stages and statuses to maintain a clear overview of the workflow.

---

<div class="post-metadata">

**Author:** ![mpayre](https://avatars.discourse-cdn.com/v4/letter/m/f9ae1b/32.png) [@mpayre](https://community.noloco.io/u/mpayre)\
**Post date:** [June 21, 2024, 6:04am UTC](https://community.noloco.io/t/change-action-bouton-after-click/869/4 "2024-06-21T06:04:30Z")

</div>

Hi Sean,

I have in mind this kind of idea but you give e opportunity to quickly adapt my app.

Thank a lot for this nice demo.

B.rgds

Matthieu

![image002.png](https://europe1.discourse-cdn.com/flex005/uploads/noloco/original/1X/cbbb43900c57cb3bf8fa2768c36247640c3379da.png)
