# Populate options in dropdown help

**URL:** <https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149>\
**Category:** Dashboard\
**Created:** [23 November 2018 15:45 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149 "2018-11-23T15:45:30Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![jmorris644](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jmorris644/32/31964_2.png) [@jmorris644](https://discourse.nodered.org/u/jmorris644)\
**Post date:** [23 November 2018 15:45 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/1 "2018-11-23T15:45:30Z")

</div>

I am trying everything that I can think of to populate the options in a dropdown. I just cannot get it right.

I have a list of areas in the house that I call zones. Each zone has a different name. I want to iterate through the zone names and have those as the visible options in the dropdown. Which the code below accomplishes. But I also want the dropdown to return a number when selected and not the zone name. For example, I want the first zone name selection to return a 1. The second to return a 2, etc.

I have looked at the ui description for the dropdown, and also online example, but I cannot get the syntax correct in my code. I am sure it is a really easy fix but I just cannot put my finger on it. I sure would appreciate a little guidance here.

```
var gblC = global.get("gblConfig");

var listArray = [];

    for (i=1;i<=2;i++) {
        
        listArray[i] = gblC.zones[i].name;
    }

msg.options = listArray;

return msg;
```

---

<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:** [23 November 2018 16:16 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/2 "2018-11-23T16:16:55Z")

</div>

Close - as per the info each entry needs to be either just a string (used for both label and value ) or an object with a label and value - from the example - `["Choice 1", "Choice 2", {"Choice 3":"3"}]`  
so you need the object version...

```
listArray[i-1] = { gblC.zones[i].name : i };
```

---

<div class="post-metadata">

**Author:** ![jmorris644](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jmorris644/32/31964_2.png) [@jmorris644](https://discourse.nodered.org/u/jmorris644)\
**Post date:** [23 November 2018 16:37 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/3 "2018-11-23T16:37:15Z")

</div>

> [@dceejay](#):
>
> listArray[i-1] = { gblC.zones[i].name , i };

Thanks, but I have tried exactly this syntax myself.

I get a syntax error in the function editor stating "expected ':' instead saw '.'"

Joe

---

<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:** [23 November 2018 16:42 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/4 "2018-11-23T16:42:00Z")

</div>

apologies (should indeed have been an : - edited above )  
Though it also depends if your global array starts at 0 or 1.... so may need to be

```
 listArray[i-1] = { gblC.zones[i-1].name : i };
```

---

<div class="post-metadata">

**Author:** ![jmorris644](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jmorris644/32/31964_2.png) [@jmorris644](https://discourse.nodered.org/u/jmorris644)\
**Post date:** [23 November 2018 16:46 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/5 "2018-11-23T16:46:56Z")

</div>

Yup, tried that too. Now I get syntax error:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/1/12fb5155dfb954d11e753b340ea6f98124e6a91f.png)

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [23 November 2018 16:50 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/6 "2018-11-23T16:50:38Z")

</div>

Show us the function node from the beginning, so we can see which is line 9 and also so we can see the lines before.

---

<div class="post-metadata">

**Author:** ![jmorris644](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jmorris644/32/31964_2.png) [@jmorris644](https://discourse.nodered.org/u/jmorris644)\
**Post date:** [23 November 2018 16:52 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/8 "2018-11-23T16:52:02Z")

</div>

its in my original post, but here it is again. Line 9 is the line within the loop.

```
> var gblC = global.get("gblConfig");
> 
> var listArray = [];
> 
> for (i=1;i<=3;i++) {
>         
> //listArray[i] = gblC.zones[i].name;
> listArray[i] = i;
> //listArray[i-1] = { gblC.zones[i].name : i };
> }
> 
> msg.options = listArray;
> 
> return msg;
```

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [23 November 2018 16:55 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/9 "2018-11-23T16:55:36Z")

</div>

That isn't the one giving the syntax error. Show us what it is like now please

---

<div class="post-metadata">

**Author:** ![jmorris644](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jmorris644/32/31964_2.png) [@jmorris644](https://discourse.nodered.org/u/jmorris644)\
**Post date:** [23 November 2018 16:58 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/10 "2018-11-23T16:58:53Z")

</div>

Sorry, I am trying to continue working so I commented out the offending line. Here it is.

FYI, both of the commented out lines within the loop work. One gives me the zone names and the other just the zone numbers

```
var gblC = global.get("gblConfig");

var listArray = [];

    for (i=1;i<=3;i++) {
        
        //listArray[i] = gblC.zones[i].name;
        //listArray[i] = i;
        listArray[i-1] = { gblC.zones[i].name : i };
    }

msg.options = listArray;

return msg;
```

---

<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:** [23 November 2018 17:00 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/11 "2018-11-23T17:00:28Z")

</div>

Something like this then

```
        listArray[i-1] = {};
        listArray[i-1][gblC.zones[i].name] = i;
```

---

<div class="post-metadata">

**Author:** ![jmorris644](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jmorris644/32/31964_2.png) [@jmorris644](https://discourse.nodered.org/u/jmorris644)\
**Post date:** [23 November 2018 17:04 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/12 "2018-11-23T17:04:54Z")

</div>

Thanks! That syntax worked.

I understand the first line. Can you please explain the syntax in the 2nd line? I don't understand what the brackets around the zone name do?

Thanks

Joe

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [23 November 2018 17:49 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/13 "2018-11-23T17:49:21Z")

</div>

> [@jmorris644](#):
>
> Can you please explain the syntax in the 2nd line?

`a.b` is actually a shorthand for `a[b]` meaning named element b of a. You can't use `listArray[i-1].gblC.zones[i].name` because that would first do `listArray[i-1].gblc` then `.zones[i]` and so on which is not what you want. You want it to evaluate `gblC.zones[i].name` first, then use that to determine which named element of `listArray[i-1]` to address. So you have to use the syntax as the dot shorthand method will not evaluate correctly.

---

<div class="post-metadata">

**Author:** ![jmorris644](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jmorris644/32/31964_2.png) [@jmorris644](https://discourse.nodered.org/u/jmorris644)\
**Post date:** [23 November 2018 17:53 UTC](https://discourse.nodered.org/t/populate-options-in-dropdown-help/5149/14 "2018-11-23T17:53:31Z")

</div>

Thanks you!!

No wonder why I could never get it to work with the "."s.