assign array values to drop down in jquery

Question

I have an array like this:

[
  [{
    "station_territory": "Peshawar-CMD"
  }, {
    "station_territory": "Faisalabad-CMD"
  }],
  [{
    "station_territory": "Faisalabad-FEM"
  }]
];

How can I assign it to a multiple drop down where the id is the station? I tried this code:

$.each(data, function(index, value) {
  $("#station") = value;
});

Rory McCrossan · Accepted Answer · 2018-07-12 07:19:43Z

1

To create option elements within the select you can loop through each level of the arrays in data create the option elements which you can assign to the select.

Note that in jQuery you never assign anything to a jQuery object itself; you use the methods that jQuery provides in order to amend elements. In this case you can use append():

var data = [
  [{
    "station_territory": "Peshawar-CMD"
  }, {
    "station_territory": "Faisalabad-CMD"
  }],
  [{
    "station_territory": "Faisalabad-FEM"
  }]
];

var options = [];
data.forEach(function(outer) {
  outer.forEach(function(inner) {
    options.push(`<option value="${inner.station_territory}">${inner.station_territory}</option>`);
  });
});
$("#station").append(options);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select multiple id="station"></select>

edited Jul 12, 2018 at 7:19

answered Jul 12, 2018 at 6:57

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Farooq Over a year ago

an error generate , can u plz resolve it `index.php?action=edit_employee&empID=5309:4393 Uncaught TypeError: data[0].map is not a function

Rory McCrossan Over a year ago

Possibly try data = JSON.parse(data) first.

Farooq Over a year ago

now its working but if the response is ` [[{"station_territory":"City0"},{"station_territory":"City1"}],[{"station_territory":"City2"}]] ` its showing only 1st two values not 3rd

Rory McCrossan Over a year ago

That's because it's a completely different data structure. You now have multiple arrays at different levels.

Farooq Over a year ago

i just want to dynamically append values from json array to multiple based drop down

|

Collectives™ on Stack Overflow

assign array values to drop down in jquery

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related