0

Tenho uma consulta que retorna um array onde eu quero popular um select de forma dinâmica, mas pelo código abaixo ele da com undefined

for(var i = 0; i <= cidades.length; i++){
            var html = "";
            html += "<option>" + cidades[i] + "</option>";    
            document.getElementById("cidade").append(html);
        }

inserir a descrição da imagem aqui

2 Respostas 2

1

Seu for está percorrendo uma vez a mais, e também acredito que o método append não vá funcionar em elementos do tipo select, tente modificar o innerHTML dele.

Segue abaixo um exemplo:

for(var i = 0; i < cidades.length; i++)
{
    var html = '<option>'+cidades[i]+'</option>';
    document.getElementById('cidade').innerHTML += html;
}

Outra maneira legal de percorrer o vetor é usando o forEach, segue exemplo:

cidades.forEach(function (cidade) {
    var html = '<option>'+cidade+'</option>';
    document.getElementById('cidade').innerHTML += html;
});
1

O elemento "cidade" é um select por isso e adicionar html a ele como faria num elemento div talvez não seja a melhor opção, a criar os elementos option e adicionar seria mais legível:

for(var i = 0; i <= cidades.length; i++){
    var selectCidade = document.getElementById("cidade");
    var option   = document.createElement("option");
    option.value = cidades[i];
    option.text  = cidades[i];
    selectCidade.appendChild(option);
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .