# How can I set the state of buttons when load the page

**URL:** <https://discourse.nodered.org/t/how-can-i-set-the-state-of-buttons-when-load-the-page/82518>\
**Category:** Dashboard\
**Created:** [1 November 2023 13:32 UTC](https://discourse.nodered.org/t/how-can-i-set-the-state-of-buttons-when-load-the-page/82518 "2023-11-01T13:32:19Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![lucianv](https://avatars.discourse-cdn.com/v4/letter/l/cab0a1/32.png) [@lucianv](https://discourse.nodered.org/u/lucianv)\
**Post date:** [1 November 2023 13:32 UTC](https://discourse.nodered.org/t/how-can-i-set-the-state-of-buttons-when-load-the-page/82518/1 "2023-11-01T13:32:19Z")

</div>

Hi,  
I have a simple flow with 2 buttons. First button is general menu and button2 is a submenu. When click button1, it goes hidden and button2 came visible and viceversa. My issue is that when I load the page first time, both of them are visible.  
I tried with an inject node but without success.  
How can I set button2 to be hidden when load the page ?

Here is a test flow

```auto
[{"id":"8b1d019cc641df04","type":"tab","label":"test","disabled":false,"info":"","env":[]},{"id":"c4f6ad9be5ac8d9a","type":"ui_button","z":"8b1d019cc641df04","name":"","group":"b85d66818842709a","order":0,"width":0,"height":0,"passthru":false,"label":"menu","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"{\"group\":{\"hide\":[\"test_menu\"],\"show\":[\"test_menu2\"]}}","payloadType":"json","topic":"topic","topicType":"msg","x":390,"y":240,"wires":[["699208322b159740"]]},{"id":"06667493c438a667","type":"ui_button","z":"8b1d019cc641df04","name":"","group":"f57982547f0f5298","order":0,"width":0,"height":0,"passthru":false,"label":"menu2","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"{\"group\":{\"hide\":[\"test_menu2\"],\"show\":[\"test_menu\"]}}","payloadType":"json","topic":"topic","topicType":"msg","x":390,"y":400,"wires":[["699208322b159740"]]},{"id":"699208322b159740","type":"ui_ui_control","z":"8b1d019cc641df04","name":"","events":"all","x":740,"y":240,"wires":[[]]},{"id":"74e7001d6ddb6fa8","type":"inject","z":"8b1d019cc641df04","name":"","props":[{"p":"payload"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"{\"group\":{\"hide\":[\"test_menu2\"],\"show\":[\"test_menu\"]}}","payloadType":"json","x":410,"y":520,"wires":[[]]},{"id":"b85d66818842709a","type":"ui_group","name":"menu","tab":"936d7e2f71ad862c","order":1,"disp":true,"width":"6","collapse":false,"className":""},{"id":"f57982547f0f5298","type":"ui_group","name":"menu2","tab":"936d7e2f71ad862c","order":2,"disp":true,"width":"6","collapse":false,"className":""},{"id":"936d7e2f71ad862c","type":"ui_tab","name":"test","icon":"dashboard","order":9,"disabled":false,"hidden":false}]

```

Here is how it appear when first open the page

 ![1](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/1/e10550cade35c1b44da7b2e4f6ddbaf91b9279d7.png)

Thank you

---

<div class="post-metadata">

**Author:** ![mudwalker](https://avatars.discourse-cdn.com/v4/letter/m/47e85d/32.png) [@mudwalker](https://discourse.nodered.org/u/mudwalker)\
**Post date:** [1 November 2023 13:56 UTC](https://discourse.nodered.org/t/how-can-i-set-the-state-of-buttons-when-load-the-page/82518/2 "2023-11-01T13:56:12Z")

</div>

To make it so that people can help, you might want to edit your post to use the recommended way of posting flows on the Forum as the Fouum corrupts some of the characters to enable them to be read.

This post describes how to share flows in the forum: [How to share code or flow json](https://discourse.nodered.org/t/how-to-share-code-or-flow-json/506)

---

<div class="post-metadata">

**Author:** ![lucianv](https://avatars.discourse-cdn.com/v4/letter/l/cab0a1/32.png) [@lucianv](https://discourse.nodered.org/u/lucianv)\
**Post date:** [1 November 2023 14:09 UTC](https://discourse.nodered.org/t/how-can-i-set-the-state-of-buttons-when-load-the-page/82518/3 "2023-11-01T14:09:04Z")

</div>

thank you,  
I changed it

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [1 November 2023 16:12 UTC](https://discourse.nodered.org/t/how-can-i-set-the-state-of-buttons-when-load-the-page/82518/4 "2023-11-01T16:12:18Z")

</div>

You xan use ui-control to listen to page connections/refresh  
e.g.

```auto
[{"id":"c4f6ad9be5ac8d9a","type":"ui_button","z":"8b1d019cc641df04","name":"","group":"b85d66818842709a","order":0,"width":0,"height":0,"passthru":false,"label":"menu","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"{\"group\":{\"hide\":[\"test_menu\"],\"show\":[\"test_menu2\"]}}","payloadType":"json","topic":"topic","topicType":"msg","x":390,"y":240,"wires":[["699208322b159740"]]},{"id":"699208322b159740","type":"ui_ui_control","z":"8b1d019cc641df04","name":"","events":"all","x":760,"y":260,"wires":[[]]},{"id":"06667493c438a667","type":"ui_button","z":"8b1d019cc641df04","name":"","group":"f57982547f0f5298","order":0,"width":0,"height":0,"passthru":false,"label":"menu2","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"{\"group\":{\"hide\":[\"test_menu2\"],\"show\":[\"test_menu\"]}}","payloadType":"json","topic":"topic","topicType":"msg","x":390,"y":300,"wires":[["699208322b159740"]]},{"id":"b2896d5020b71460","type":"change","z":"8b1d019cc641df04","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"{\"group\":{\"hide\":[\"test_menu2\"],\"show\":[\"test_menu\"]}}","tot":"json"}],"action":"","property":"","from":"","to":"","reg":false,"x":580,"y":380,"wires":[["699208322b159740"]]},{"id":"c6661e388f5df0c8","type":"ui_ui_control","z":"8b1d019cc641df04","name":"","events":"connect","x":380,"y":380,"wires":[["b2896d5020b71460"]]},{"id":"b85d66818842709a","type":"ui_group","name":"menu","tab":"936d7e2f71ad862c","order":1,"disp":true,"width":"6","collapse":false,"className":""},{"id":"f57982547f0f5298","type":"ui_group","name":"menu2","tab":"936d7e2f71ad862c","order":2,"disp":true,"width":"6","collapse":false,"className":""},{"id":"936d7e2f71ad862c","type":"ui_tab","name":"test","icon":"dashboard","order":9,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [31 December 2023 16:12 UTC](https://discourse.nodered.org/t/how-can-i-set-the-state-of-buttons-when-load-the-page/82518/5 "2023-12-31T16:12:26Z")

</div>

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.