Filling up a dropdown using an array

Question

I am trying to fill up a drop-down menu with the data in a variable. This is what I have so far, and it doesn't work. What am I doing wrong?

<script>
$(function() {
    $('#dropdownMenu1').click(function() {
        var director_names = {"director_name": ["Aaron Schneider", "Aaron Seltzer", "Abel Ferrara", "Adam Goldberg", "Adam Marcus", "Adam McKay", "Adam Rapp", "Adam Rifkin", "Adam Shankman", "Adrian Lyne", "Adrienne Shelly", "Agnieszka Holland", "Agnieszka Wojtowicz-Vosloo", "Akiva Goldsman", "Akiva Schaffer", "Alan Cohn", "Alan J. Pakula", "Alan Metter", "Alan Parker", "Alan Poul", "Alan Rudolph", "Alan Shapiro", "Alan Taylor"]};

        var myDDL = document.getElementById("dropdownMenu1");
                var i;
                for (i = 0; i < director_names.director_name.length; i++) {
                    var option = document.createElement("option");
                    option.text = director_names.director_name[i].name;

                    option.value = director_names.director_name[i].address;
                    try {
                        myDDL.options.add(option);
                    }
                    catch (e) {
                        alert(e);
                    }
                }
    });
});
</script>

your json does not contain `name` and `address`.. It is a string array, so you can only use `director_names.director_name[i]` for both `value` and `text` of the `option`. — Gabriele Petrioli, Apr 18 '17 at 16:36
That is not valid JavaScript; I'm assuming it's because you have cut out some stuff before the closing `script` tag... The line `var director_names : {"..."};` is not doing what you think it is, you need to use a `=` to assign the a value to the variable. Using a `:` like that, it is being interpreted as a [label](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label). There is [no JSON in this question](http://stackoverflow.com/questions/2904131/what-is-the-difference-between-json-and-object-literal-notation), only an object literal, which you think is JSON. — Useless Code, Apr 18 '17 at 17:06

Tudor Constantin · Accepted Answer · 2017-04-18T16:43:50.257

you have at least one syntax error. Try with:

<script>
        $( document ).ready(function() {
        var director_names = {"director_name": ["Aaron Schneider", "Aaron Seltzer", "Abel Ferrara", "Adam Goldberg", "Adam Marcus", "Adam McKay", "Adam Rapp", "Adam Rifkin", "Adam Shankman", "Adrian Lyne", "Adrienne Shelly", "Agnieszka Holland", "Agnieszka Wojtowicz-Vosloo", "Akiva Goldsman", "Akiva Schaffer", "Alan Cohn", "Alan J. Pakula", "Alan Metter", "Alan Parker", "Alan Poul", "Alan Rudolph", "Alan Shapiro", "Alan Taylor"]}

        var myDDL = document.getElementById("dropdownMenu1");

        for (i = 0; i < director_names.director_name.length; i++) {
          var option = document.createElement("option");
          option.text = director_names.director_name[i];

          option.value = director_names.director_name[i];
          try {
            myDDL.options.add(option);
          }
          catch (e) {
            alert(e);
          }
        }
      });
</script>

And, as G. Petriolly said, you only have the names in that JSON, you don't have the addresses. I've created this jsfiddle with the above code to show that the select box gets populated with the names.

Filling up a dropdown using an array

1 Answers1