Tengo un index con dos select dependientes, los cuales funcionan bien si no están dentro de un form.
La cosa es que necesito tenerlos dentro de este (form) para posteriormente guardar los datos seleccinados en la base de datos. He probado javascript, ajax, jquery, y la verdad que siempre me muestra bien el dato con alerts y demás, pero necesito capturar el "idtitulacion" para realizar la segunda consulta.
Os dejo mi index.php
Código PHP:
<?php include "mysql_con.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Garabatos Linux</title>
</head>
<script type="text/javascript">
//FUNCION AJAX PARA LLAMAR LOS DATOS DEL SEGUNDO COMBO
function ddlEspecialidad(idTitulacion){ //variable que espera la funcion
var xmlhttp;
if (window.XMLHttpRequest){// codigo for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}else{// codigo for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
//funcion que se llama cada vez que cambia la propiedad readyState
xmlhttp.onreadystatechange=function(){
//readyState 4: peticion finalizada y respuesta lista
//status 200: OK
if (xmlhttp.readyState===4 && xmlhttp.status===200){
//Pasar la respuesta html a ddlEspecialidad
document.getElementById("ddlEspecialidad").innerHTML=xmlhttp.responseText;
}
};
/* open(metodo, url, asincronico)
* metodo: post o get
* url: localizacion del archivo en el servidor
* asincronico: comunicacion asincronica true o false.
*/
xmlhttp.open("POST","get_combo2.php",true);
//establece el header para la respuesta
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//enviamos las variables al archivo get_combo2.php
xmlhttp.send("idTitulacion=" + idTitulacion);
}
</script>
<body>
<?php
//conectamos con mysql
$conn= conMysql();
if(!$conn){
die("<br/>Sin conexión.");
}
//cargamos la info del primer combo con este sql
$sql="select * from titulacion";
$query= mysqli_query($conn, $sql);
mysqli_close($conn);
?>
<form>
<select id="ddlTitulacion" style="width: 120px;" onchange="ddlEspecialidad(this.value);">
<option>- seleccione -</option>
<?php
//llenamos el combo con la informacion
while ($row = mysqli_fetch_array($query)) {
echo "<option value='{$row['idTitulacion']}'>{$row['titulacion']}</option>";
}
?>
</select>
<!-- div para el segundo combo -->
<!--
dibujamos un select vacio solo para "reservar" el espacio
que ocupará el verdadero combo2.
La etiqueta div con su id es importante porque en el
javascript de arriba estamos indicando que sustituya el contenido
de este div especificamente.
-->
<select id="ddlEspecialidad" name="ddlEspecialidad" style="width: 120px;">
<option></option>
</select>
</form>
<!-- fin: div para el segundo combo -->
</body>
</html> Código PHP:
<?php
include "mysql_con.php";
//conexion con mysql
$conn= conMysql();
if(!$conn){
die("<br/>Sin conexión.");
}
//recibimos la variable enviada desde ajax
$idTitulacion = $_POST["idTitulacion"];
//hacemos el query para obtener los datos segun la
//variable obtenida
$sql="select t.titulacion, e.especialidad
from titulacion t, especialidad e, titulacionespecialidad te
where t.idTitulacion = te.titulacion
and e.idEspecialidad = te.especialidad and t.idTitulacion = $idTitulacion";
//ejecutamos el query
$query= mysqli_query($conn, $sql);
mysqli_close($conn);
?>
<!--Este es el verdadero ddlEspecialidad que mostramos con los datos cargados-->
<select id="ddlEspecialidad" style="width: 120px;">
<option>- seleccione -</option>
<?php
while ($row = mysqli_fetch_array($query)) {
echo "<option ='{$row['idEspecialidad']}'>{$row['especialidad']}</option>";
}
?>
</select> Muchisimas gracias por vuestra ayuda, estaré atento...
saludos chicos!
