3

Tenho o seguinte código:

$("#cep").on('mouseout', function() {

    var url = "http://cep.republicavirtual.com.br/web_cep.php";
    var cep = $(this).val();

    $.ajax({
        type: "GET",
        dataType: 'json',
        data: {'cep': cep, 'formato': 'json'},
        async: false,
        url: url,
        success: function(response) {

            if (response.resultado === '1') {

                $("#bairro").val(response.bairro);
                $("#endereco").val(response.logradouro);

                var uf = response.uf;
                $("select#estado option").each(function() {
                    this.selected = (this.text === uf);
                });

                $("#estado").trigger("change");

                var cidade = response.cidade;

                $("select#cidade option").each(function() {
                    this.selected = (this.text === cidade);
                    console.log(this.selected);
                });

            }

        }
    });

});

Nessa parte do código deveria "setar" a cidade no combo que foi retornada via ajax. Note que essa parte vem após o $("#estado").trigger("change");

var cidade = response.cidade;

$("select#cidade option").each(function() {
   this.selected = (this.text === cidade);
});

Não funciona, as cidades são preenchidas, a cidade vem normalmente mas não é "setada" como default no combo box.

Como resolver isso?

3
  • Pode postar aqui o console.log(response)? parece-me que ele está a retornar xml.
    – Sergio
    15/02/2014 às 13:48
  • Seus options não têm value?
    – bfavaretto
    15/02/2014 às 14:03
  • sim, tem value mas o retorno vem como texto e por isso tenho que usar assim
    – csassis
    15/02/2014 às 15:24

2 Respostas 2

2

Talvez funcione colocando o código para executar dentro de um callback (event handler):

        $("select#cidade").one("atualizado", function(){
            var cidade = response.cidade;
            $("select#cidade option").each(function() {
                this.selected = (this.text === cidade);
                console.log(this.selected);
            });
        });

        $("#estado").trigger("change");

Estou supondo que existe um callback para o evento change de #estado, para modificar a lista de cidades. Portanto, o código que marca a opção selecionada deve ser executado depois da atualização da lista de cidades.

Na sugestão acima, usamos a função one do jQuery para que um novo callback seja executado uma única vez, e em seguida seja descartado.

Você vai precisar também disparar o evento "atualizado". Faça isso no teu código. Coloque o comando abaixo imediatamente após a atualização das options do select que contém a lista de cidades do estado:

$("select#cidade").trigger("atualizado");
5
  • Mesmo dessa forma não consegui sucesso, estou procurando e se encontrar posto aqui para nós
    – csassis
    15/02/2014 às 15:25
  • Provavelmente o outro callback tem uma chamada ajax para carregar as cidades... o código que verifica o selected deveria ser executado após o callback daquele ajax. Se quiser mais ajuda, precisa editar sua pergunta e colocar mais código aí.
    – J. Bruni
    15/02/2014 às 15:53
  • Pronto - atualizei a resposta. Veja se ajuda.
    – J. Bruni
    15/02/2014 às 15:59
  • Obrigado, o código acima funcionou certinho. Fica então a dica para quem precisar.
    – csassis
    15/02/2014 às 23:00
  • Por gentileza, aceite a minha resposta clicando no "check" ao lado da mesma. Recomendo que leia: pt.stackoverflow.com/tour
    – J. Bruni
    16/02/2014 às 1:34
2

Tente usar .val()
Remova este trecho de código

$("select#cidade option").each(function() {
    this.selected = (this.text === cidade);
    console.log(this.selected);
});

E insira este

$("select#cidade").val(cidade);

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 .