# UI Dropdown, non persistent options

**URL:** <https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372>\
**Category:** Dashboard\
**Created:** [3 January 2019 23:53 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372 "2019-01-03T23:53:56Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [3 January 2019 23:53 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/1 "2019-01-03T23:53:56Z")

</div>

Hi everybody,  
I have a permanent udp/osc message comming to my network, i transform it to populate the dropdown menu with a function :

var newmsg = msg;  
newmsg.options = [];  
var canal, value1;  
for (var i = 0; i \< msg.payload.length; i++) {  
canal = msg.payload[i].address;  
value1 = msg.payload[i].args;  
newmsg.options[i] = {};  
newmsg.options[i][canal] = value1;  
}

return msg;

It works fine, the dropdown menu is correctly populate but it refresh everytime i receive a message.  
(60 fps, so quite a bite often :D)

How can i manage to populate it in a constant maner in wich the label do not have to refresh everytime the value changes ?

Thanks in advance.

---

<div class="post-metadata">

**Author:** ![ukmoose](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ukmoose/32/13_2.png) [@ukmoose](https://discourse.nodered.org/u/ukmoose)\
**Post date:** [4 January 2019 08:34 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/2 "2019-01-04T08:34:51Z")

</div>

take a look at the RBE node aka report by exception  
which can filter out messages if they are the same

---

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [4 January 2019 12:45 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/3 "2019-01-04T12:45:21Z")

</div>

Thanks for you answer.  
It is working when there is no changes, but as soon as the value changes the dropdown menu get reset and i have to select again.

---

<div class="post-metadata">

**Author:** ![ukmoose](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ukmoose/32/13_2.png) [@ukmoose](https://discourse.nodered.org/u/ukmoose)\
**Post date:** [4 January 2019 13:00 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/4 "2019-01-04T13:00:08Z")

</div>

But if there are changes when would you expect the dropbown menu to be repopulated?

---

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [4 January 2019 13:03 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/5 "2019-01-04T13:03:57Z")

</div>

I meant values changes, not adress changes.  
Here is what is my signal in ![oscin](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/d/dee4c8125ddbf31594853e2689c39a58b6a3cf68.png)

In the dropdown i want to select the adress ('chan1 or chan2 ...) and the retrieve the value (args) when it changes.

But actually when the value changes the dropdown is repopulated.  
I am not sure i am clear 😃

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [4 January 2019 13:22 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/6 "2019-01-04T13:22:38Z")

</div>

Trying to clarify the issue.  
Are you looking for last selected value/option to be selected again after re-population occurs?

---

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [4 January 2019 14:17 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/7 "2019-01-04T14:17:55Z")

</div>

Exactly.  
If i choose /chan1, i want to keep this chan selected when re-population happen.

---

<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:** [4 January 2019 14:21 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/8 "2019-01-04T14:21:53Z")

</div>

You need to re-inject "chan1" as the msg.payload as well as the new msg.options - otherwise you are just injecting (nothing) - so it selects ... nothing...

---

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [4 January 2019 14:27 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/9 "2019-01-04T14:27:13Z")

</div>

When args on chan1 changes a new msg.payload is send to the dropdown, with adress and args, i would like that it keeps chan1 selected (the adress) but modifie the args associated with it.

---

<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:** [4 January 2019 15:15 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/10 "2019-01-04T15:15:43Z")

</div>

ah right - I think you will need to do this as a function following the select - make the select just choose chan1, 2 3 etc... and then that is selected do the lookup to the value from the object you have (which could be held in context to save it)

The way the dropdown works is the value is (in your case) the args which keep changing and the displayed items to pick from are chan1 2 etc... but to preselect the item you need to set it's value - which you can't do if it has just changed.

---

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [4 January 2019 15:25 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/11 "2019-01-04T15:25:34Z")

</div>

Thanks,  
So if i understand it right i first have to select my adress, place it in the context and then retrieve is value with a function.  
Exit the dropdown then ?  
I guess there is no node helping much with that no ? Have to code a function to do it right ?

---

<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:** [4 January 2019 15:36 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/12 "2019-01-04T15:36:22Z")

</div>

yes - but most of the hard work could be done by the function that creates the dropdown options in the first place as it could also create the hashtable object at the the same time and save it in context so that then the following function would just be a simple lookup...

Of course this may mean that now the dropdown can just be a set list of chan1, 2, 3 etc if the names are now fixed... and it's now just the input that updates the hashtable object when the values change, and the output from the select that performs the lookup when selected. Of course the value then selected won't change until selected again.

---

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [4 January 2019 16:09 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/13 "2019-01-04T16:09:15Z")

</div>

That kind of the problem here, the aim is to be able to connect different osc device with different adress name. So the dropdown menu should be dynamic and the name self explanatory.  
Will figure out 😃

---

<div class="post-metadata">

**Author:** ![dithdsgn](https://avatars.discourse-cdn.com/v4/letter/d/eb9ed0/32.png) [@dithdsgn](https://discourse.nodered.org/u/dithdsgn)\
**Post date:** [8 January 2019 11:44 UTC](https://discourse.nodered.org/t/ui-dropdown-non-persistent-options/6372/14 "2019-01-08T11:44:44Z")

</div>

Finaly i dit find a solution. (thanks to dceejay ;))  
So for the one interested, i input in the dropdown menu the osc address and output also the osc adress. I declare it in a flow variable, and then compare it in a function with the incoming osc msg.  
If address of the incoming = adress of the flow i take the value associated with it.  
Here is the flow

```auto
[{"id":"c58a9dd2.f91e8","type":"tab","label":"Flow 3","disabled":false,"info":""},{"id":"5520d829.a6fd78","type":"udp in","z":"c58a9dd2.f91e8","name":"","iface":"","port":"1881","ipv":"udp4","multicast":"false","group":"","datatype":"buffer","x":143.5,"y":148,"wires":[["27021ee5.78dac2"]]},{"id":"27021ee5.78dac2","type":"osc","z":"c58a9dd2.f91e8","name":"","path":"","metadata":false,"x":281.5,"y":150,"wires":[["a3a563c1.f3127","a7474af7.3673d8"]]},{"id":"a3a563c1.f3127","type":"function","z":"c58a9dd2.f91e8","name":"","func":"var newmsg = msg;\nnewmsg.options = [];\nvar value, canal;\n\nfor (var i = 0; i < msg.payload.length; i++) {\n canal = msg.payload[i].address;\n value = msg.payload[i].address;\n newmsg.options[i] = {};\n newmsg.options[i][canal] = value;\n}\n\nreturn msg;\n","outputs":1,"noerr":0,"x":428,"y":146,"wires":[["caa68db4.0ff03"]]},{"id":"caa68db4.0ff03","type":"rbe","z":"c58a9dd2.f91e8","name":"","func":"rbe","gap":"","start":"","inout":"out","property":"options","x":563,"y":144,"wires":[["b13a37d8.2cb5e8"]]},{"id":"b13a37d8.2cb5e8","type":"ui_dropdown","z":"c58a9dd2.f91e8","name":"","label":"","tooltip":"","place":"Select option","group":"15dd32a9.cfc27d","order":4,"width":0,"height":0,"passthru":true,"options":[{"label":"","value":"","type":"str"}],"payload":"","topic":"","x":698,"y":143,"wires":[["663b4bfb.97bdd4","28bc8e8a.c96922"]]},{"id":"a08c46d.110f1b8","type":"ui_text","z":"c58a9dd2.f91e8","group":"15dd32a9.cfc27d","order":5,"width":0,"height":0,"name":"","label":"text","format":"{{msg.valeur}}","layout":"row-spread","x":988,"y":260,"wires":[]},{"id":"663b4bfb.97bdd4","type":"debug","z":"c58a9dd2.f91e8","name":"","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"payload","x":834,"y":78,"wires":[]},{"id":"a7474af7.3673d8","type":"function","z":"c58a9dd2.f91e8","name":"","func":"var newmsg = msg;\nnewmsg.valeur = [];\noscIn=flow.get(\"oscIn\");\nvar value, canal;\n\nfor (var i = 0; i < msg.payload.length; i++) {\n canal = msg.payload[i].address;\n value = msg.payload[i].args;\n\tif (canal == oscIn.payload) {\n\tnewmsg.valeur = value;\n\ti = msg.payload.length;\n} \n else {\n newmsg.valeur = \"select an Input\";\n }\n}\n\n \nreturn msg;\n","outputs":1,"noerr":0,"x":616,"y":294,"wires":[["c2403dce.45ae9","a08c46d.110f1b8"]]},{"id":"28bc8e8a.c96922","type":"function","z":"c58a9dd2.f91e8","name":"","func":"flow.set(\"oscIn\", msg);\nreturn msg;","outputs":1,"noerr":0,"x":874,"y":142,"wires":[[]]},{"id":"c2403dce.45ae9","type":"debug","z":"c58a9dd2.f91e8","name":"","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"valeur","x":844,"y":294,"wires":[]},{"id":"15dd32a9.cfc27d","type":"ui_group","z":"","name":"Default","tab":"fb9b8517.106e88","disp":true,"width":"6","collapse":false},{"id":"fb9b8517.106e88","type":"ui_tab","z":"","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

```