# How to populate dashboard dropdown button dynamically

**URL:** https://discourse.nodered.org/t/how-to-populate-dashboard-dropdown-button-dynamically/5594
**Category:** General
**Created:** [8 December 2018 22:19 UTC](https://discourse.nodered.org/t/how-to-populate-dashboard-dropdown-button-dynamically/5594 "2018-12-08T22:19:50Z")
**Posts on this page:** 4
**Page:** 2

<div class="post-metadata">

### Author: ![OmegaJune](https://avatars.discourse-cdn.com/v4/letter/o/7cd45c/32.png) [@OmegaJune](https://discourse.nodered.org/u/OmegaJune)
#### Post date: [10 September 2020 20:26 UTC](https://discourse.nodered.org/t/how-to-populate-dashboard-dropdown-button-dynamically/5594/21 "2020-09-10T20:26:21Z")

</div>

I'm reviving this topic because I'm having trouble getting the options in the dropdown list to be dynamic. I'm trying to build a string for each choice, but what I'm doing here isn't working. Any advice is appreciated.

```auto
[{"id":"6a5ce82b.1fb528","type":"ui_dropdown","z":"10428117.fbe57f","name":"","label":"","tooltip":"","place":"Select option","group":"cdbf58bd.144278","order":23,"width":0,"height":0,"passthru":true,"multiple":false,"options":[{"label":"","value":"","type":"str"}],"payload":"","topic":"","x":910,"y":260,"wires":[[]]},{"id":"8b0e1b1c.884df8","type":"function","z":"10428117.fbe57f","name":"Populate Dropdown Options","func":"let dynamicOption;\nlet numberOfOptions = 5;\n\nlet choice = [];\n\nfor (let i = 0; i < numberOfOptions; i++) {\n dynamicOption = \"Option \" + i;\n \n choice.push( { dynamicOption : i} );\n}\n\nmsg.options = choice;\n\n\nreturn msg;","outputs":1,"noerr":0,"x":640,"y":260,"wires":[["6a5ce82b.1fb528","6c2db2b7.00660c"]]},{"id":"cdfc651.21af698","type":"inject","z":"10428117.fbe57f","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":400,"y":260,"wires":[["8b0e1b1c.884df8"]]},{"id":"6c2db2b7.00660c","type":"debug","z":"10428117.fbe57f","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":880,"y":220,"wires":[]},{"id":"cdbf58bd.144278","type":"ui_group","z":"","name":"Utilities","tab":"57a8107c.24ef7","order":3,"disp":true,"width":"6","collapse":false},{"id":"57a8107c.24ef7","type":"ui_tab","z":"","name":"NOAH 18898","icon":"dashboard","disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

### Author: ![yoyocarry](https://avatars.discourse-cdn.com/v4/letter/y/dec6dc/32.png) [@yoyocarry](https://discourse.nodered.org/u/yoyocarry)
#### Post date: [13 May 2021 03:37 UTC](https://discourse.nodered.org/t/how-to-populate-dashboard-dropdown-button-dynamically/5594/22 "2021-05-13T03:37:12Z")

</div>

try this

choice.push( { [dynamicOption] : i} );

---

<div class="post-metadata">

### Author: ![Ochsenblut](https://avatars.discourse-cdn.com/v4/letter/o/82dd89/32.png) [@Ochsenblut](https://discourse.nodered.org/u/Ochsenblut)
#### Post date: [4 November 2022 09:20 UTC](https://discourse.nodered.org/t/how-to-populate-dashboard-dropdown-button-dynamically/5594/23 "2022-11-04T09:20:26Z")

</div>

Yes @yoyocarry 's code works. In this way we can create the option labels dynamically.

Only: Can somebody explain _why_ it works? Why do the square brackets change the behavior of the  
{key : value} expression?

Thanks a lot!

---

<div class="post-metadata">

### Author: ![Buckskin](https://avatars.discourse-cdn.com/v4/letter/b/b9e5f3/32.png) [@Buckskin](https://discourse.nodered.org/u/Buckskin)
#### Post date: [4 November 2022 17:42 UTC](https://discourse.nodered.org/t/how-to-populate-dashboard-dropdown-button-dynamically/5594/24 "2022-11-04T17:42:58Z")

</div>

Because they change the property name to the value between the brackets;

```auto
let dynamicOption = "propertyKey"

let object = {[dynamicOption]: 10} 

// is the same as
// let object = {propertyKey: 10}

```

[Previous page](https://discourse.nodered.org/t/how-to-populate-dashboard-dropdown-button-dynamically/5594.md?page=1)