Aqui te envio un codigo completo donde yo utilizo dos listas (Provincias) y (Municipios)
PHP y AJAX
PAGINA DONE SE MUESTRAN LAS DOS LISTAS
Lista provincia -> Llena desde un include
Código HTML:
Ver original <td width="25%">Provincia:
</td> <td width="30%">Municipio:
</td> <td width="45%">Consejo popular:
</td> <td><?php include('../ubicacion/provincias.php'); ?></td> <td><div id="listamunicipios"> <select class="cajatexto" id="obj_municipio" >
Pagina: provincias.php
Código PHP:
Ver original<select id="obj_provincia" class="cajatexto" onchange="mostrarMunicipios()">
<option value="">Seleccionar...</option>
<?php
require('../../includes/conexion.php');
?>
<option value="<?php echo $row_prov['id']; ?>"><?php echo $row_prov['provincia']; ?></option>
<?php } ?>
</select>
Pagina: municipios.php
Código PHP:
Ver original<select id="obj_municipio" class="cajatexto" onchange="mostrarConsejos()">
<option value="">Seleccionar...</option>
<?php
require('../../includes/conexion.php');
$provincia=$_POST['idprov'];
$rs_mun=mysql_query("SELECT * FROM nm_municipios WHERE idprovincia='".$provincia."'"); ?>
<option value="<?php echo $row_mun['id']; ?>"><?php echo $row_mun['municipio']; ?></option>
<?php } ?>
</select>
La pagina de ajax
Código Javascript
:
Ver original//========================
//CREACION DEL OBJETO AJAX
//========================
function objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
//==================
// CARGAR MUNICIPIOS
//==================
function mostrarMunicipios(){
divResultado = document.getElementById('listamunicipios');
prov=document.getElementById('obj_provincia').value;
ajax=objetoAjax();
ajax.open("POST", "../ubicacion/municipios_mostrar.php",true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
divResultado.innerHTML = ajax.responseText
}
}
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
ajax.send("idprov="+prov)
}
Espero con esto poder ayudarte...