3

Estou utilizando o ASP.NET MVC 5 e o EF6 num projeto, e tenho uma classe que faz uma consulta no site dos correios e me retorna o endereço a partir do CEP. Até ai, tudo certo, o que eu gostaria de fazer é utilizar o onblur para assim que no cadastro o usuário sair do campo CEP, todos os outros campos (menos o número) relacionados a endereço sejam atualizados.

Utilizo View fortemente tipada, mas não encontrei uma forma de atualizar apenas o model. Alguém pode me ajudar?

2
  • 1
    Poderia mostrar um exemplo de como está o seu código? 2/10/2015 às 17:43
  • 1
    Se entendi bem, você quer atualizar o model sem ter uma nova request. Não é assim que funciona. A view é usada uma vez para renderizar HTML que é entregue ao cliente. Depois disso, a view (razor) não é mais utilizada até que haja outra request. O que você precisa é, então, usar AJAX para preencher os campos em função da busca nos correios.
    – RSinohara
    2/10/2015 às 17:48

1 Resposta 1

3

Acompanhando o comentário do @RSinohara, o caminho é por Ajax na View. Em um sistema que escrevo, uso um conjunto de métodos implementados usando jQuery:

function TrocarCidades(id, estadoId) {
    $("#CidadeId").attr('disabled', true);
    $("#EstadoId").attr('disabled', true);

    $.ajax({
        url: "/Estados/SelecionarCidades/" + estadoId,
        success: function (data) {
            if (id == null) {
                $("#BairroId").empty();
                $("#BairroId").append('<option value>Selecione uma Cidade...</option>');
            }
            $("#CidadeId").empty();
            $("#CidadeId").append('<option value>Selecione...</option>');
            $.each(data, function (index, element) {
                $("#CidadeId").append('<option value="' + element.CidadeId + '">' + element.Nome + '</option>');
            });

            $("#CidadeId").attr('disabled', false);
            $("#EstadoId").attr('disabled', false);
            $("#CidadeId").val(id);
        }
    });
}

function TrocarBairros(id, cidadeId) {
    $("#BairroId").attr('disabled', true);
    $("#CidadeId").attr('disabled', true);
    $("#EstadoId").attr('disabled', true);

    $.ajax({
        url: "/Bairros/SelecionarPorCidade/" + cidadeId,
        success: function (data) {
            $("#BairroId").empty();
            $("#BairroId").append('<option value>Selecione...</option>');
            $.each(data, function (index, element) {
                $("#BairroId").append('<option value="' + element.BairroId + '">' + element.Nome + '</option>');
            });

            $("#BairroId").attr('disabled', false);
            $("#CidadeId").attr('disabled', false);
            $("#EstadoId").attr('disabled', false);

            if (id != null) {
                $("#BairroId").val(id);
            }
        }
    });
}

$("#CEP").blur(function () {
    $.ajax({
        url: "/Logradouros/BuscarPorCep/" + $(this).val(),
        success: function (data) {
            $("#EstadoId").val(data.Bairro.Cidade.EstadoId);
            TrocarBairros(data.BairroId, data.Bairro.CidadeId);
            TrocarCidades(data.Bairro.CidadeId, data.Bairro.Cidade.EstadoId);
            $("#Endereco").val(data.Descricao);
        }
    });
});

$("#EstadoId").change(function () {
    TrocarCidades(null, $(this).val());
});

$("#CidadeId").change(function () {
    TrocarBairros(null, $(this).val());
});

Esta implementação leva em consideração que bairros, cidades e estados são DropDownLists. Você pode simplificar este algoritmo para sua necessidade. Ou seja:

$("#CEP").blur(function () {
    $.ajax({
        url: /* Url de serviço de busca de CEP */
        success: function (data) {
            $("#Estado").val(data.Estado);
            $("#Bairro").val(data.Bairro);
            $("#Cidade").val(data.Cidade);
            $("#Endereco").val(data.Endereco);
        }
    });
});

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 .