Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal, beleza? Bom vmaos ao que interessa.
Eu estou criando um pequeno sistema de busca interno no meu site, de maneira que a pessoa vai selecionar o ESTADO, depois CIDADE e assim achar o IMOVÉL da qual ela deseja para alugar.
É bem simples, mas estou tendo problema que acredito serem fáceis de resolver. Primeiramente criei uma pagina da qual vai mostrar os campos (SELECT) com as opções da ESTADO > CIDADE.
<html>
<head>
<title>Exemplo: Populando selects de cidades e estados com AJAX (PHP e jQuery)</title>
</head>
<body>
<?php
$con = mysql_connect( 'localhost', 'root', '' ) ;
mysql_select_db( 'franz', $con );
?>
<label for="cod_estados">Estado:</label>
<select name="cod_estados" id="cod_estados">
<option value=""></option>
<?php
$sql = "SELECT cod_estados, sigla
FROM estados
ORDER BY sigla";
$res = mysql_query( $sql );
while ( $row = mysql_fetch_assoc( $res ) ) {
echo '<option value="'.$row['cod_estados'].'">'.$row['sigla'].'</option>';
}?>
</select>
<label for="cod_cidades">Cidade:</label>
<span class="carregando">Aguarde, carregando...</span>
<select name="cod_cidades" id="cod_cidades">
<option value="">-- Escolha uma Cidade --</option>
</select>
<script src="[http://www.google.com/jsapi">](http://www.google.com/jsapi)
<script type="text/javascript">
google.load('jquery', '1.3');
</script>
<script type="text/javascript">
$(function(){
$('#cod_estados').change(function(){
if( $(this).val() ) {
$('#cod_cidades').hide();
$('.carregando').show();
$.getJSON('cidades.ajax.php?search=',{cod_estados: $(this).val(), ajax: 'true'}, function(j){
var options = '<option value=""></option>';
for (var i = 0; i < j.length; i++) {
options += '<option value="' + j[i].cod_cidades + '">' + j[i].nome + '</option>';
}
$('#cod_cidades').html(options).show();
$('.carregando').hide();
});
} else {
$('#cod_cidades').html('<option value="">– Escolha uma Cidade –</option>');
}
});
});
</script>
</body>
</htm>
Depois vem a pagina cidades.ajax.php:
<?php
header( 'Cache-Control: no-cache' );
header( 'Content-type: application/xml; charset="utf-8"', true );
$con = mysql_connect( 'localhost', 'root', 'root' ) ;
mysql_select_db( 'cadastro', $con );
$cod_estados = mysql_real_escape_string( $_REQUEST['cod_estados'] );
$cidades = array();
$sql = "SELECT cod_cidades, nome
FROM cidades
WHERE estados_cod_estados=$cod_estados
ORDER BY nome";
$res = mysql_query( $sql );
while ( $row = mysql_fetch_assoc( $res ) ) {
$cidades[] = array(
'cod_cidades' => $row['cod_cidades'],
'nome' => $row['nome'],
);
}
echo( json_encode( $cidades ) );
Até ai tudo bem mas quando vou TESTAR ao escolher o ESTADO ele fica só no CARREGANDO e não mostra nada, mas eu criei a banco tanto que ele já mostra os ESTADO, mas não entendi o fato de não mostrar a cidade assim que clicar.
Para ilustrar melhor vou mostrar como estão registradas as informações no banco:
CREATE TABLE `cidades` (
`estados_cod_estados` int(11) default NULL,
`cod_cidades` int(11) default NULL,
`nome` varchar(72) collate utf8_unicode_ci default NULL,
`cep` varchar(8) collate utf8_unicode_ci default NULL
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
CREATE TABLE `estados` (
`cod_estados` int(11) default NULL,
`sigla` varchar(2) collate utf8_unicode_ci default NULL,
`nome` varchar(72) collate utf8_unicode_ci default NULL
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
INSERT INTO `estados` (`cod_estados`, `sigla`, `nome`) VALUES (20, 'RJ', 'RIO DE JANEIRO');
INSERT INTO `cidades` (`estados_cod_estados`, `cod_cidades`, `nome`, `cep`) VALUES (20, 7043, 'RIO DE JANEIRO', '00000000');
Nesse caso ai do banco, o certo seria ao selecionar ESTADO > RIO DE JANEIRO ele mostraria CIDADE > RIO DE JANEIRO, ao contrario disso ele apenas mostra CARREGANDO e dai não sai.
Agradeço a ajuda e deixo o código ai para quem quiser aproveita-lo tbm em seus futuros projetos.
Carregando comentários...