# Hidden groups always visible when opening Dashboard in browser for the first time

**URL:** <https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456>\
**Category:** Dashboard\
**Created:** [28 September 2020 16:14 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456 "2020-09-28T16:14:31Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![rucksman007](https://avatars.discourse-cdn.com/v4/letter/r/a88e4f/32.png) [@rucksman007](https://discourse.nodered.org/u/rucksman007)\
**Post date:** [28 September 2020 16:14 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/1 "2020-09-28T16:14:31Z")

</div>

I have several groups on my dashboard in one tab, some of which may or may not be visible depending on various parameters. This is possible via a function node and a payload like

```auto
payload={"group":{"show":["Group1"], "hide":["Group2","Group3"]}};

```

and works fine so far.

The problem: When I open the dashboard in a browser for the first time, all groups that should be invisible are visible. But the code works fine in my opinion, it seems that I am missing something.

Example: I open the dashboard on my computer in Firefox. All groups are visible, which is wrong. I create the correct state manually using an inject node. The dashboard in Firefox is then correct. Then I open the dashboard in another browser, e.g. Chrome, on the same computer. Again all groups are visible, which is wrong again. In Firefox on the same computer the dashboard is still correct.

How can I solve the problem so that the correct state is displayed every time I start Dashboard?

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [28 September 2020 17:23 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/2 "2020-09-28T17:23:01Z")

</div>

Use the ui\_control node to create an event on connections and use that to send that same message as the inject

---

<div class="post-metadata">

**Author:** ![rucksman007](https://avatars.discourse-cdn.com/v4/letter/r/a88e4f/32.png) [@rucksman007](https://discourse.nodered.org/u/rucksman007)\
**Post date:** [28 September 2020 19:32 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/3 "2020-09-28T19:32:15Z")

</div>

Thanks for the quick answer. But I am afraid my knowledge is not advanced enough to get your point. Could you please explain in detail (or post a rough flow as an example) on what I should do? I saw that the ui\_control node delivers 3 events when I open the dashboard (lost, connect, change), but I do not understand how I can take advantage of that. Should I wire another function node to the output of my already exiting ui\_control node, check if incoming payload is "connect" and then use the same input to the ui\_control node as the output of this function node which delivers this payload to another (new) ui\_control node???

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [28 September 2020 20:23 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/4 "2020-09-28T20:23:32Z")

</div>

Yes, ui\_control node set to "Connect event only" -\> function node (or change node) to set msg.payload to the hide groups message as per your inject -\> ui\_control node (either a different one or loop back to same one... shouldn't matter.

---

<div class="post-metadata">

**Author:** ![rucksman007](https://avatars.discourse-cdn.com/v4/letter/r/a88e4f/32.png) [@rucksman007](https://discourse.nodered.org/u/rucksman007)\
**Post date:** [30 September 2020 07:56 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/5 "2020-09-30T07:56:12Z")

</div>

Thanks, this works fine. One last question: I am sending my payload through a function node into the ui\_control node. Then I will use - as you suggested - another function node to set the same payload to a new ui\_control node. Problem: The first ui\_control node does not forward the incoming payload to the output, so my following function node does not know anything about the desired visibility state. Hardcoding the visibility state in the function node is of course not possble. Any suggestion how to forward the visibility state of my first function node through the first ui\_control node to the second function node? Thanks for your help! I really appreciate this!

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [30 September 2020 08:17 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/6 "2020-09-30T08:17:58Z")

</div>

split the wires and send it to both ?

---

<div class="post-metadata">

**Author:** ![rucksman007](https://avatars.discourse-cdn.com/v4/letter/r/a88e4f/32.png) [@rucksman007](https://discourse.nodered.org/u/rucksman007)\
**Post date:** [30 September 2020 10:59 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/7 "2020-09-30T10:59:27Z")

</div>

Sorry for being so stupid, but I cannot figure out how I should wire everything together. Lets see what I have:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/1/912c16e1c9f9db2076831fd822d2d18c29851b1e.png)

- The function node determines visibility by checking some parameters, and puts it into the payload. The output is unknown. Groups could be visible or not.
- The first ui\_control gets the payload. It is configured as "Connect event only".
- The change node gets - what? Obviously both the payload from the function node and the ui\_control node. So this makes no sense to me as it fires "connect" into the second ui\_control when accessing the dashboard which does nothing whereas it should fire the payload from the function node into the second ui\_control.

Sorry again for being that stupid, but at the moment I do not see the wood for the trees ...

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [30 September 2020 12:02 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/8 "2020-09-30T12:02:08Z")

</div>

Ah right ok - instead I would just use the function to store the visibility value into a flow context variable - then use the change node to set the payload from that variable. The top ui control node doesn't then need an input at all as it just provides the connect message.

---

<div class="post-metadata">

**Author:** ![rucksman007](https://avatars.discourse-cdn.com/v4/letter/r/a88e4f/32.png) [@rucksman007](https://discourse.nodered.org/u/rucksman007)\
**Post date:** [30 September 2020 14:02 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/9 "2020-09-30T14:02:01Z")

</div>

OK, so this is now what I came up with:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/b/3b22352e10f0abe43321ace5e44968e85ddaf1d7.png)  
Seems to work, although I did not understand what you mean by saying

> The top ui control node doesn't then need an input at all as it just provides the connect message.

Which of the two ui\_control nodes is "the top ui\_control"? Thanks again for your patience!

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [30 September 2020 14:58 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/10 "2020-09-30T14:58:52Z")

</div>

the one that was above (on top) of the others in your first picture.

---

<div class="post-metadata">

**Author:** ![rucksman007](https://avatars.discourse-cdn.com/v4/letter/r/a88e4f/32.png) [@rucksman007](https://discourse.nodered.org/u/rucksman007)\
**Post date:** [30 September 2020 15:09 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/11 "2020-09-30T15:09:32Z")

</div>

Ah I see, that makes perfectly sense. Thanks again for enlighten me!

---

<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:** [30 October 2020 15:09 UTC](https://discourse.nodered.org/t/hidden-groups-always-visible-when-opening-dashboard-in-browser-for-the-first-time/33456/12 "2020-10-30T15:09:39Z")

</div>

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