2

Não sei o que está errado que não está puxando os dados do json, meu objetivo é puxar os dados cidade/bairro para exibir atraves de um outro código javascript, porém não consigo fazer o select exibir as cidades e os bairros que estão no arquivo json.

Código javascript

<script type="text/javascript"> 


    $(document).ready(function () {

                        $.getJSON('cidade_bairro.json', function (data) { alert(JSON.stringify(data))

                            var items = [];
            var options = '<option value="">Escolha uma cidade</option>';   

            $.each(!data, function (key, val) {
                options == '<option value="' + val.nome + '">' + val.nome + '</option>';
            });                 
            $("#cidades").html(options);                

            $("#cidades").change(function () {              

                var options_cidades = '';
                                    var options_bairros = '';
                var str = "";                   

                $("#cidades option:selected").each(function () {
                    str += $(this).text();
                });

                $.each(!data, function (key, val) {
                    if(val.nome == str) {                           
                        $.each(val.cidades, function (key_city, val_city) {
                            options_cidades += '<option value="' + val_city + '">' + val_city + '</option>';
                        });                         
                    }
                });
                            }).change();

              $("#bairros").html(options);

              $("#bairros").change(function () {

              $("#bairros option:selected").each(function () {
                                        str += $(this).text();
                                    });

                                    $.each(data, function (key, val) {
                                        if(val.nome == str) {
                                            $.each(val.bairros, function (key_neighborhood, val_neighborhood){
                                                options_bairros += '<option value="' + val_neighborhood +'">' + val_neighborhood + '</option>';
                                            });
                                        }
                                    });

            }).change();        

        });

    });

</script>

Código HTML

    <!-- Cidade -->
    <select id="cidades">
        <option value=""></option>
    </select>
            <!-- Bairros -->
    <select id="bairros">
                <option value=""></option>
    </select>
1
  • Por favor evitem longas discussões nos comentários; a conversa de vocês foi movida para o chat
    – bfavaretto
    Commented 23/03/2017 às 17:19

1 Resposta 1

1

Cara, eu não entendi muito bem o que você está tentando fazer, mas segue o código para listar os bairros de uma cidade.

<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<head>

<script type="text/javascript">

$(document).ready(function () {
var str = ""
                        $.getJSON('/cidade_bairro.json', function (data) { 


                            var items = [];
            var options = '<option value="">Escolha uma cidade</option>';   

            $.each(data[0].bairro, function (key, val) {
                $("#cidades").append($('<option>', {
                    value: val,
                    text: val
                }));
            });                 

            $("#cidades").change(function () {              

                var options_cidades = '';
                                    var options_bairros = '';
                var str = "";                   

                $("#cidades option:selected").each(function () {
                    str += $(this).text();
                });

                $.each(!data, function (key, val) {
                    if(val.nome == str) {                           
                        $.each(val.cidades, function (key_city, val_city) {
                            options_cidades += '<option value="' + val_city + '">' + val_city + '</option>';
                        });                         
                    }
                });
                            }).change();

              $("#bairros").html(options);

              $("#bairros").change(function () {

              $("#bairros option:selected").each(function () {
                                        str += $(this).val();
                                    });

                                    $.each(data, function (key, val) {
                                        if(val.nome == str) {
                                            $.each(val.bairros, function (key_neighborhood, val_neighborhood){
                                                options_bairros += '<option value="' + val_neighborhood +'">' + val_neighborhood + '</option>';
                                            });
                                        }
                                    });

            }).change();        

        });

    });
</script>
</head>
<body>
    <select id="cidades">
        <option value=""></option>
    </select>
            <!-- Bairros -->
    <select id="bairros">
                <option value=""></option>
    </select>
</body>
</html>

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 .