iterate json subarray data in jquery+ajax

Question

i'm trying to get data form an json array and populate a select field with jquery and ajax, my json look like this:

{
"regioni": 
[
    {
        "nome": "Abruzzo",
        "capoluoghi": ["Chieti", "L'Aquila", "Pescara", "Teramo"],
        "province":["CH","AQ","PE","TE"]
    },
    {
        "nome": "Basilicata",
        "capoluoghi": ["Matera", "Potenza"],
        "province":["MT","PZ"]
    },
    {
        "nome": "Calabria",
        "capoluoghi": ["Catanzaro", "Cosenza", "Crotone", "Reggio Calabria", "Vibo Valentia"],
        "province":["CZ","CS","KR","RC","VV"]
    }
]}

what i want to do now is to take the only "name" field and iterate it with a for cycle, but it seems not work properly:

            var parsa = $.parseJSON(data);
$select = $('.c-select');
            for(var i=0; i<parsa.regioni.nome; i++){
                $select.append('<option>'+ parsa.regioni[i].nome +'</option>')
            }

what is wrong? }

Possible duplicate of [What is the best way to add options to a select from an array with jQuery?](http://stackoverflow.com/questions/170986/what-is-the-best-way-to-add-options-to-a-select-from-an-array-with-jquery) — Lucas Infante, Oct 22 '15 at 15:49
the json model is a different type (this is an array), and there is no for or each cycle — Nonsono Statoio, Oct 22 '15 at 15:58

Danny Fardy Jhonston Bermúdez · Accepted Answer · 2015-10-22T16:10:50.903

Change

i<parsa.regioni.nome;

to

i<parsa.regioni.length;

However, directly, you can iterate over data.regioni. Something like this:

$(function() {
  var data = {
    "regioni": [{
      "nome": "Abruzzo",
      "capoluoghi": ["Chieti", "L'Aquila", "Pescara", "Teramo"],
      "province": ["CH", "AQ", "PE", "TE"]
    }, {
      "nome": "Basilicata",
      "capoluoghi": ["Matera", "Potenza"],
      "province": ["MT", "PZ"]
    }, {
      "nome": "Calabria",
      "capoluoghi": ["Catanzaro", "Cosenza", "Crotone", "Reggio Calabria", "Vibo Valentia"],
      "province": ["CZ", "CS", "KR", "RC", "VV"]
    }]
  };

  var $select = $('.c-select');
  for (var i = 0; i < data.regioni.length; i++) {
    $select.append('<option>' + data.regioni[i].nome + '</option>');
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="c-select"></select>

iterate json subarray data in jquery+ajax

1 Answers1