Não é recomendado usar
async: false
. Veja o porquê nesta pergunta.
Isso é porque você está querendo pegar a cidade antes de processar o Ajax que troca o Estado e popula o select
das cidades, assim o código não sabe qual option
selecionar.
Precisa fazer o laço...
$("select#cidade_ress option").each(function() {
this.selected = (this.text === cidade);
});
...após o select
das cidades ser populado. Faça o seguinte: envie o valor da cidade como parâmetro do trigger
para o Ajax dos estados e coloque o laço naquele Ajax:
var cidade = response.cidade;
$("#estado_ress").trigger("change", cidade);
E no Ajax dos Estados (evento change
), receba o valor cidade
enviado pelo trigger
e faça o laço:
$('#estado_ress').change(function(e, cidade){
var param = $(this).val();
$.post("../escola/busca_cidade.php", { est: param }, function(valor){
$("#aqui_cidadec").html(valor);
$("select#cidade_ress option").each(function() {
this.selected = (this.text === cidade);
});
});
});
Resumindo, o Ajax do CEP ficaria assim:
$.ajax({
type: "GET",
dataType: 'json',
data: {'cep': cep, 'formato': 'json'},
async: false,
url: url,
success: function(response) {
if (response.resultado === '1') {
$("#bairro_res").val(response.bairro);
$("#logradouro_res").val(response.logradouro);
var uf = response.uf;
$("select#estado_ress option").each(function() {
this.selected = (this.text === uf);
});
var cidade = response.cidade;
$("#estado_ress").trigger("change", cidade);
}
}
});
});
E o dos Estados assim:
$('#estado_ress').change(function(e, cidade){
var param = $(this).val();
$.post("../escola/busca_cidade.php", { est: param }, function(valor){
$("#aqui_cidadec").html(valor);
$("select#cidade_ress option").each(function() {
this.selected = (this.text === cidade);
});
});
});
##Edit##
Função para remover os acentos dos nomes das cidades:
function remAcentos(p){
var acc = {
'â': 'a', 'à': 'a', 'ã': 'a', 'â': 'a',
'é': 'e', 'ê': 'e',
'í': 'i',
'ó': 'o', 'õ': 'o', 'ô': 'o',
'ú': 'u'
}
return p.replace(/[áàãâéêíóõôú]/g, function(m){
return acc[m];
});
}
Para usar a função, inclua a variável `cidade` ao chamá-la:
$('#estado_ress').change(function(e, cidade){
cidade = remAcentos(cidade); // AQUI REMOVE OS ACENTOS
$("select#cidade_ress option").each(function() {
this.selected = (this.text.toLowerCase() === cidade);
});
});
Também é interessante adicionar um toLowerCase()
aqui:
this.selected = (this.text.toLowerCase() === cidade);
Porque pode ser que alguma cidade pode vir com letra maiúscula acentuada. Com toLowerCase()
esse problema é contornado.