Foreach Ajax for combo

Question

I have the following Ajax snippet to feed text or select input with already defined values:

                ids.forEach(function (id) {
                    document.getElementById(id).value = dados[id];
                });

I wonder if you have how to create a new option for a field of type select I set, using the result of Ajax. For example: In HTML I have declared select with no option, it would only be created from the result of this Ajax. It is possible?

Answer 1

The return should be on json.

return json_encode($cidades)

JS

   var box_select = $('#cidades');
   var estado = $(this).val();

   $.ajax({
        dataType: 'json',
        url: urlBase + '/busca-cidades',
        type: "POST",
        cache: false,
        async: false,
        data: { estado: estado },
        success: function(data){
            if(estado != ''){
                box_select.html('');

                // Faz o ForEach
                $.each(data, function(i, val){
                    // Append tem a função de inserir
                    box_select.append("<option value='"+val.id+"'>"+val.nome+"</option>");
                });
            }
            else{
                box_select.html('');
            }
        }
    });

To call this AJAX do a function onchange on the combobox.