Encontrei alguns artigos pelo Stack já, porém, tentei de todas formas fazer funcionar e não consegui. Possuo um banco com todos estados e cidades do Brasil, que estão ok.
Página do Select
<!-- Select Estado -->
<div class="form-group">
<label class="col-md-4 control-label" for="selectbasic">Estado</label>
<div class="col-md-6">
<select id="estados" name="selectEstado" class="form-control" onchange="getStates();">
<?php
$resultEstado = getEstado($con);
while ($rowEstado = $resultEstado->fetch_assoc()) {
echo "<option value=\"{$rowEstado['nome']}\">";
echo $rowEstado['nome'];
echo "</option>";
}
?>
</select>
</div>
</div>
<!-- Select Cidade -->
<div class="form-group">
<label class="col-md-4 control-label" for="selectbasic">Cidade</label>
<div class="col-md-6">
<select id="cidades" name="selectCidade" class="form-control">
<option value="">Selecione o Estado</option>
</select>
</div>
</div>
No final dessa página há um include "include('footer.php');?> " onde está o seguinte script:
<script>
function getStates(){
$.ajax({
url:'lib/getCidades.php',
cache:false,
data:{state:$('#estados').val()},
beforeSend:function(){
// do something here. possibly a loader
},
success:function(response){
// remove the loader here
$('#cidades').html(response);
}
})
}
</script>
E aqui o arquivo getCidades
$resultCidadeBaladas = getCidadeBalada($con);
while ($rowCidade = $resultCidadeBaladas->fetch_assoc()) {
echo "<option value=\"{$rowCidade['nome']}\">";
echo $rowCidade['nome'];
echo "</option>";
}
Por mais que tente selecionar um estado, não retorna nenhuma cidade. O console do Chrome retorna o seguinte:
Uncaught ReferenceError: getStates is not defined
footer.php
está correto)... também pode fazer um teste colocando o script no final da página do select, logo antes do</body>
... Em tempo: está chamando a jQuery né?getCidades
tiver só aquele script php não precisa... É importante que a jQuery esteja antes do script, porque senão o ajax não vai funcionar. Abre o inspetor do chrome, vai em Network, dá um F5 e vê se a jQuery está carregando direito. Vê se ela aparece na lista de arquivos carregados...