Estoy haciendo un select dependiente de país/provincia/ciudad. Necesito que al seleccionar el país muestre en el segundo select las distintas provincias de ese país que existen en la tabla usuarios. Y al seleccionar una provincia muestre en el tercer select las ciudades que existen en la tabla para esa provincia. La tabla es algo así:
usuario | pais | provincia | ciudad
Este es el código que tengo para hacer la primera parte, la de seleccionar el país y que muestre las provincias. No tengo mucha idea de Javascript ni de Ajax, lo he hecho viendo un vídeo, pero no funciona. A ver si me podéis ayudar.
<!DOCTYPE html>
<html>
<head>
<title>Combo 3 Niveles</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
</head>
<body>
<form method="post" action="buscar.php">
<select name="paises" id="paises" >
<option value="">País</option>
<option value="España">España</option>
<option value="Argentina">Argentina</option>
</select>
<select name="provincias" id="provincias">
</select>
<input type="submit" value="BUSCAR">
</form>
<script>
$(document).ready(function(e){
$("#paises").change(function(){
var parametros= "pais="+$("#paises").val();
$.ajax({
data: parametros,
url: 'ajax_provincias.php',
type: 'post',
beforeSend: function () {
alert("Enviando")
},
succes: function(response) {
$("provincias").html(response);
},
error: function(){
alert("error")
}
});
})
})
</script>
</body>
</html>
ajax_provincias.php
<?php
include 'includes/dbopen.php';
if(isset($POST['pais'])):
$u=$db->query("SELECT distinct provincia FROM usuarios WHERE pais='$POST['pais']' ORDER BY provincia ASC");
$html="";
foreach ($u as $value)
$html.="<option value='".$value['provincia']."'>".$value['provincia']."</option>";
echo $html;
echo "No hay post";
endif;?>