Este é um problema que muitos inicinates em PHP enfrentam no “caminho das pedras“, então resolvi postar este tópico que esclarece esse problema. O exemplo mais classico que existe por ai é o de “Estados e Cidades” mas só pra sair da tradição vou resolver usando “Marcas e Carros” o que também não foge tanto assim da regra (droga).
Monte uma tabela de estados no seu DB com os seguintes campos:
id_estado, estado; e nomeie a tabela como “estados”
Agora monte a tabela das cidades com os seguintes campos:
id_cidade, id_estado,cidade; e a nomeie como “cidades”
<html>
<head></head>
<body>
<select name="listCidades" class="btn-slide" id="listCidades"> <option value="0">Cidades ...</option>
<?php require_once("../conecta.php"); // função de conexao ao banco
$sql = "SELECT * FROM estados"; $query=mysql_query($sql);
while($res = mysql_fetch_array($query))
{
echo '<option value='".$res['id_estado']."'>".$res['estado']."</option>';// o tecnica está nesta linha, observe que o php gera uma tag HTML com os dados de cada estado até que termine o while
}
?>
</select>
</body>
</html
Pronto, teste o código e veja oque acontece, …, aconteceu que o select “listEstados” está preenchido com um lista dos estados cadastrados no banco, agora vamos pra segunda etapa do nosso exemplo, iremos preencher o select “listCidades” com as cidades que pertencem ao estado selecionado no primeiro select.
Faça um novo arquivo no NotPad++ e salve-o com o nome de “procura_cidades.php” e digite o código a seguir:
<?php
require_once(“conecta.php”); //conexao ao banco de dados
extract ($_POST);
$sql = “SELECT * FROM cidades WHERE id_estado=”.id_estado;
$query = mysql_query($sql);
while($res = mysql_fetch_array($query))
{
echo “<option value='”.$res[‘id_cidade’].”‘>”.$res[‘cidade’].”</option><br>”;
}
?>
Este é o código que retorna as cidades de acordo com o id_estado passado para o código SQL.
Salve o arquivo e vote na página html onde está o formulario com os selects.
No topo da pagina, nates mesmo da tag <html> digite esse cogido JQuery a seguir.
<script type=”text/javascript” src=”jquery.js”></script>
<script language=”javascript” type=”text/javascript”>
$(document).ready(
function()
{
$(“select[@id=listEstados]”).change( //ao selecionar um item no select a funcao é acionada
function()
{
$(‘#listCidades’).html(‘<option value=”sda”>Procurando :::::::</option>’);
$.post(‘procura_cidades.php’,{id_estado: $(this).val() }, //envia o código do estado via POST atraves da variavel “id_estado” para o arquivo “procura_cidades.php”
function(resposta)
{
$(‘#listCidades’).html(resposta); //retorna o conteudo gerado em “procura_cidades.php” para dentro do select listCidades.
});
});
});//fim ready
</script>
E pronto, creio eu que o esquema já deve estar funcionando, qualquer coisa comentem.