para que pueda tener un combo mas, creo que es sencillo pero no logro hacerlo de manera correcta, pueden echarle una mirada ?
combos.php
Código PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<?php
function generaSelect()
{
$coneccion=mysql_connect("localhost", "root", "") or die(mysql_error());
mysql_select_db("directorio_x4", $coneccion) or die(mysql_error());
$consulta=mysql_query("SELECT * FROM idx_category WHERE parent_id=0");
mysql_close($coneccion);
// Voy imprimiendo el primer select compuesto por los registros obtenidos
echo "<select class='combo' id='select_1' name='select_1' onChange='cargaContenido(2)'>";
echo "<option value='0'>Elige</option>";
while($registro=mysql_fetch_row($consulta))
{
echo "<option value='$registro[0]'>$registro[2]</option>";
}
echo "</select>";
}
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ejemplo</title>
<script language="javascript" type="text/javascript">
function nuevoAjax()
{
/* Crea el objeto AJAX. Esta funcion es generica para cualquier utilidad de este tipo, por
lo que se puede copiar tal como esta aqui */
var xmlhttp=false;
try
{
// Creacion del objeto AJAX para navegadores no IE
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
// Creacion del objet AJAX para IE
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(E) { xmlhttp=false; }
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp=new XMLHttpRequest(); }
return xmlhttp;
}
function cargaContenido(selectACargar)
{
// Recibo el número correspondiente al combo que se debe llenar de datos
var selectAnterior=selectACargar-1; // Obtengo el número del combo que activó el evento onChange
// Extraigo el valor del combo que se ha cambiado
var valor=document.getElementById("select_"+selectAnterior).options[document.getElementById("select_"+selectAnterior).selectedIndex].value;
var elemento;
if(valor!=0)
{
ajax=nuevoAjax();
// Envio al servidor el valor seleccionado y el combo al cual se le deben poner los datos
ajax.open("GET", "select_dependientes_3_niveles_proceso.php?seleccionado="+valor+"&select="+selectACargar, true);
ajax.onreadystatechange=function()
{
if (ajax.readyState==1)
{
// Mientras carga elimino la opcion "Elige" y pongo una que dice "Cargando"
elemento=document.getElementById("select_"+selectACargar);
elemento.length=0;
var opcionCargando=document.createElement("option"); opcionCargando.value=0; opcionCargando.innerHTML="Cargando...";
elemento.appendChild(opcionCargando); elemento.disabled=true;
}
if (ajax.readyState==4)
{
// Coloco en la fila contenedora los datos que recivo del servidor
document.getElementById("fila_"+selectACargar).innerHTML=ajax.responseText;
}
}
ajax.send(null);
}
/* Colocamos mediante los whiles los selects en "Selecciona opción..." cuando el select anterior
ha quedado en estado "Elige" */
var x=1, y=null;
while(x<=2)
{
valor=document.getElementById("select_"+x).options[document.getElementById("select_"+x).selectedIndex].value;
if(valor==0)
{
while(x<=2)
{
y=x+1;
elemento=document.getElementById("select_"+y);
elemento.length=0;
var opcionSelecciona=document.createElement("option"); opcionSelecciona.value=0; opcionSelecciona.innerHTML="Selecciona opción...";
elemento.appendChild(opcionSelecciona); elemento.disabled=true;
x++;
}
}
x++;
}
}
</script>
<style type="text/css">
.punteado
{
border-style:dotted;
border-color:#000000;
background-color:#EAEAEA;
font-family:Verdana;
font-size:10px;
text-align:center;
}
.combo
{
font-family:Verdana;
font-size:10px;
border-color:#CCCCCC;
}
</style>
</head>
<body>
<center>
<table border="1" width="600px" style="border-style:none;">
<tr>
<td id="fila_1" width="200px" class="punteado"><?php generaSelect(); ?></td>
<td id="fila_2" width="200px" class="punteado">
<select class="combo" disabled="disabled" id="select_2" name="select_2">
<option id="valor_defecto" value="0">Selecciona opción...</option>
</select>
</td>
<td id="fila_3" width="200px" class="punteado">
<select class="combo" disabled="disabled" id="select_3" name="select_3">
<option id="valor_defecto" value="0">Selecciona opción...</option>
</select>
</td>
</tr>
</table>
</center>
</body>
</html>
Código PHP:
<?php
function validaEntrada($valor, $selectACargar)
{
// Funcion utilizada para validar el numero recibido por GET.
if($selectACargar==2 && $valor>=1 && $valor<=4)
return TRUE;
elseif($selectACargar==3 && $valor>=1 && $valor<=12)
return TRUE;
else return TRUE;
}
$valor=$_GET["seleccionado"]; $selectACargar=$_GET["select"];
if(validaEntrada($valor, $selectACargar))
{
// Si el numero corresponde a un codigo de pais valido paso a procesar
$coneccion=mysql_connect("localhost", "root", "") or die(mysql_error());
mysql_select_db("directorio_x4", $coneccion) or die(mysql_error());
// Genero la consulta trayendo todos los estados que correspondan al codigo de pais elegido
$consulta=mysql_query("SELECT * FROM idx_category WHERE parent_id=$valor");
mysql_close($coneccion);
// Comienzo a imprimir el select
if($selectACargar==2)
echo "<select class='combo' onChange='cargaContenido(3)' id='select_$selectACargar' name='select_$selectACargar'>";
else
echo "<select class='combo' id='select_$selectACargar' name='select_$selectACargar'>";
echo "<option value='0'>Elige</option>";
while($registro=mysql_fetch_row($consulta))
{
// Paso a HTML acentos y ñ para su correcta visualizacion
$registro[2]=htmlentities($registro[2]);
// Imprimo las opciones del select
echo "<option value='$registro[0]'>$registro[2]</option>";
}
echo "</select>";
}
?>