Combobox dependientes enlazados a bases de datos

He intentado de varias maneras hacer lo siguiente y no he dado con el chiste...
Tengo 3 tablas con los siguientes campos:
Continente. Idcontinente, continente.nombrecon; pais. Idpais, pais. Idcontinente, pais.nombrepai; ciudad. Idciudad, ciudad. Idpais, ciudad. Nombreciu;
la idea es cargar desde la base datos primero el continente, luego dependiendo del idcontinente hacemos un join con el pais y luego con idpais hacemos el join con ciudades para que me muestre los nombres respectivos con el evento onchange() y no lo he podido lograr, he bajado libros, tutoriales, codigo y todos dicen que lo hacen pero ninguno realmente sirve...
Estoy trabajando sobre php 5, mysql 5, apache 2

2 respuestas

Respuesta
1
Lo que deseas hacer no es sencillo pues involucra mezalcra php con javascript osea código del lado del servidor y código del lado del cte, yo hice uno hace tiempo si una te interesa dejame buscarlo para pasártelo.
Sigo esperando el archivo...
Cuando tengas el php te ancargaria si lo puede spublicar aquí mismo para tenerlo como futras referencias.
No encuentro mi archivo fuente de php. Pero te envío el correspondiente script que hace espo.. solo hay que hacer que el php te genere un archivo similar al que te estoy mostrando, espero seas un buen programador y lo puedas sacar... si no pues te ancargaria un poco de tiempo porque ahorita mis timepos están muy apretados..
Saludos
<body >
<form name="forma1" method="post" action="altas.asp">
<table>
<tr><td>* Estado</td>
<td>
<select name="estado" onchange="redirect(this.options.selectedIndex)">
<option value='' > 01 -- Estado </option>
<option value='Aguascalientes' >Aguascalientes</option>
<option value='Baja California Norte' >Baja California Norte</option>
<option value='Baja California Sur' >Baja California Sur</option>
<option value='Campeche' >Campeche</option>
<option value='Chiapas' >Chiapas</option>
<option value='Chihuahua' >Chihuahua</option>
<option value='Coahuila' >Coahuila</option>
<option value='Colima' >Colima</option>
<option value='Distrito Federal' >Distrito Federal</option>
<option value='Durango' >Durango</option>
<option value='Edo. de México' >Edo. de México</option>
<option value='Guerrero' >Guerrero</option>
<option value='Guanajuato' >Guanajuato</option>
<option value='Hidalgo' >Hidalgo</option>
<option value='Jalisco' >Jalisco</option>
<option value='Michoacan' >Michoacan</option>
<option value='Morelos' >Morelos</option>
<option value='Nayarit' >Nayarit</option>
<option value='Nuevo León' >Nuevo León</option>
<option value='Puebla' >Puebla</option>
<option value='Oaxaca' >Oaxaca</option>
<option value='Queretaro' >Queretaro</option>
<option value='Quintana Roo' >Quintana Roo</option>
<option value='San Luis Potosi' >San Luis Potosi</option>
<option value='Sinaloa' >Sinaloa</option>
<option value='Sonora' >Sonora</option>
<option value='Tabasco' >Tabasco</option>
<option value='Tamaulipas' >Tamaulipas</option>
<option value='Tlaxcala' >Tlaxcala</option>
<option value='Veracruz' >Veracruz</option>
<option value='Yucatan' >Yucatan</option>
<option value='Zacatecas' >Zacatecas</option>
<option value='Otro' >Otro</option>
<option value='01 -- Estado' >01 -- Estado</option>
</select>
</td>
</tr>
<tr>
<td>* Ciudad</td>
<td>
<select name="ciudad" >
<option value="" selected>02 - - Ciudad</option>
</select>
<script>
<!--
var groups=document.forma1.estado.options.length
var group=new Array(groups)
for (i=0; i<groups; i++)
group=new Array()
group[0][0]=new Option("Ciudad ","0");
group[1][0]=new Option("02 -- Ciudad","0");
group[1][1]=new Option("Aguascalientes ","Aguascalientes ");
group[1][2]=new Option("Jesús María ","Jesús María ");
group[2][0]=new Option("02 -- Ciudad","0");
group[2][1]=new Option("Mexicali ","Mexicali ");
group[2][2]=new Option("Tecate ","Tecate ");
group[2][3]=new Option("Tijuana ","Tijuana ");
group[3][0]=new Option("02 -- Ciudad","0");
group[3][1]=new Option("Cabo San Lucas ","Cabo San Lucas ");
group[3][2]=new Option("Ensenada ","Ensenada ");
group[3][3]=new Option("La Paz ","La Paz ");
group[3][4]=new Option("San José del Cabo ","San José del Cabo ");
group[4][0]=new Option("02 -- Ciudad","0");
group[4][1]=new Option("Campeche ","Campeche ");
group[4][2]=new Option("Cd. del Carmen ","Cd. del Carmen ");
group[5][0]=new Option("02 -- Ciudad","0");
group[5][1]=new Option("Chiapa de Corzo","Chiapa de Corzo");
group[5][2]=new Option("San Cristóbal de las Casas ","San Cristóbal de las Casas ");
group[5][3]=new Option("Tapachula ","Tapachula ");
group[5][4]=new Option("Tuxtla Gutiérrez ","Tuxtla Gutiérrez ");
group[6][0]=new Option("02 -- Ciudad","0");
group[6][1]=new Option("Cd. Juárez ","Cd. Juárez ");
group[6][2]=new Option("Chihuahua ","Chihuahua ");
group[7][0]=new Option("02 -- Ciudad","0");
group[7][1]=new Option("Coahuila ","Coahuila ");
group[7][2]=new Option("Piedras Negras ","Piedras Negras ");
group[7][3]=new Option("Saltillo ","Saltillo ");
group[7][4]=new Option("Torreón ","Torreón ");
group[8][0]=new Option("02 -- Ciudad","0");
group[8][1]=new Option("Colima ","Colima ");
group[8][2]=new Option("Manzanillo ","Manzanillo ");
group[9][0]=new Option("02 -- Ciudad","0");
group[9][1]=new Option("Ciudad de México ","Ciudad de México ");
group[10][0]=new Option("02 -- Ciudad","0");
group[10][1]=new Option("Durango ","Durango ");
group[10][2]=new Option("Gómez Palacio ","Gómez Palacio ");
group[10][3]=new Option("Lerdo","Lerdo");
group[11][0]=new Option("02 -- Ciudad","0");
group[11][1]=new Option("Acolman ","Acolman ");
group[11][2]=new Option("Amecameca ","Amecameca ");
group[11][3]=new Option("Atiz de Zar","Atiz de Zar");
group[11][4]=new Option("Atizapán de Zaragoza ","Atizapán de Zaragoza ");
group[11][5]=new Option("Cd. Nezahualcóyotl ","Cd. Nezahualcóyotl ");
group[11][6]=new Option("Chalco ","Chalco ");
group[11][7]=new Option("Chimalhuacán ","Chimalhuacán ");
group[11][8]=new Option("Coacalco ","Coacalco ");
group[11][9]=new Option("Cuautitlán ","Cuautitlán ");
group[11][10]=new Option("Ecatepec de Morelos ","Ecatepec de Morelos ");
group[11][11]=new Option("Huehuetoca ","Huehuetoca ");
group[11][12]=new Option("Huixquilucan","Huixquilucan");
group[11][13]=new Option("Ixtapaluca","Ixtapaluca");
group[11][14]=new Option("Jilotepec ","Jilotepec ");
group[11][15]=new Option("Lerma ","Lerma ");
group[11][16]=new Option("Los Reyes la Paz ","Los Reyes la Paz ");
group[11][17]=new Option("Metepec","Metepec");
group[11][18]=new Option("Naucalpan de Juárez ","Naucalpan de Juárez ");
group[11][19]=new Option("San Mateo Atenco ","San Mateo Atenco ");
group[11][20]=new Option("Santiago Tianguistenco","Santiago Tianguistenco");
group[11][21]=new Option("Tecamac ","Tecamac ");
group[11][22]=new Option("Tejupilco ","Tejupilco ");
group[11][23]=new Option("Texcoco ","Texcoco ");
group[11][24]=new Option("Tlalmanalco ","Tlalmanalco ");
group[11][25]=new Option("Tlalnepantla ","Tlalnepantla ");
group[11][26]=new Option("Toluca ","Toluca ");
group[11][27]=new Option("Tultepec ","Tultepec ");
group[11][28]=new Option("Tultitlán ","Tultitlán ");
group[11][29]=new Option("Valle de Bravo","Valle de Bravo");
group[11][30]=new Option("Valle de México ","Valle de México ");
group[11][31]=new Option("Villa del Carbón ","Villa del Carbón ");
group[11][32]=new Option("Villa Nicolás Romero ","Villa Nicolás Romero ");
group[11][33]=new Option("Zinacantepec ","Zinacantepec ");
group[11][34]=new Option("Zumpango ","Zumpango ");
group[12][0]=new Option("02 -- Ciudad","0");
group[12][1]=new Option("Acapulco ","Acapulco ");
group[12][2]=new Option("Chilpancingo ","Chilpancingo ");
group[12][3]=new Option("Iguala","Iguala");
group[12][4]=new Option("Ixtapa Zihuatanejo ","Ixtapa Zihuatanejo ");
group[13][0]=new Option("02 -- Ciudad","0");
group[13][1]=new Option("Acambaro","Acambaro");
group[13][2]=new Option("Allende ","Allende ");
group[13][3]=new Option("Apaseo el Alto","Apaseo el Alto");
group[13][4]=new Option("Celaya ","Celaya ");
group[13][5]=new Option("Guanajuato ","Guanajuato ");
group[13][6]=new Option("Irapuato ","Irapuato ");
group[13][7]=new Option("León ","León ");
group[13][8]=new Option("Salamanca ","Salamanca ");
group[13][9]=new Option("San Fco. del Rincon","San Fco. del Rincon");
group[14][0]=new Option("02 -- Ciudad","0");
group[14][1]=new Option("Ciudad Sagun","Ciudad Sagun");
group[14][2]=new Option("Cooperativa Cruz Azul","Cooperativa Cruz Azul");
group[14][3]=new Option("Ixmiquilpan","Ixmiquilpan");
group[14][4]=new Option("Mineral de la Reforma","Mineral de la Reforma");
group[14][5]=new Option("Pachuca ","Pachuca ");
group[14][6]=new Option("Tula ","Tula ");
group[15][0]=new Option("02 -- Ciudad","0");
group[15][1]=new Option("Autlán de Navarro","Autlán de Navarro");
group[15][2]=new Option("Guadalajara ","Guadalajara ");
group[15][3]=new Option("Ocotlan","Ocotlan");
group[15][4]=new Option("Puerto Vallarta ","Puerto Vallarta ");
group[15][5]=new Option("San Miguel el Alto","San Miguel el Alto");
group[15][6]=new Option("Tlajomulco de Zuñiga","Tlajomulco de Zuñiga");
group[15][7]=new Option("Tlaquepaque ","Tlaquepaque ");
group[15][8]=new Option("Zapopan ","Zapopan ");
group[16][0]=new Option("02 -- Ciudad","0");
group[16][1]=new Option("La Piedad ","La Piedad ");
group[16][2]=new Option("Lázaro Cárdenas ","Lázaro Cárdenas ");
group[16][3]=new Option("Morelia ","Morelia ");
group[16][4]=new Option("Sahuayo","Sahuayo");
group[16][5]=new Option("Tarimbaro","Tarimbaro");
group[16][6]=new Option("Uruapan ","Uruapan ");
group[17][0]=new Option("02 -- Ciudad","0");
group[17][1]=new Option("Cuautla ","Cuautla ");
group[17][2]=new Option("Cuernavaca ","Cuernavaca ");
group[17][3]=new Option("Jojutla","Jojutla");
group[17][4]=new Option("Temixco","Temixco");
group[17][5]=new Option("Zacatepec ","Zacatepec ");
group[18][0]=new Option("02 -- Ciudad","0");
group[18][1]=new Option("Tepic ","Tepic ");
group[19][0]=new Option("02 -- Ciudad","0");
group[19][1]=new Option("Apodaca ","Apodaca ");
group[19][2]=new Option("Escobedo","Escobedo");
group[19][3]=new Option("Guadalupe","Guadalupe");
group[19][4]=new Option("Monterrey ","Monterrey ");
group[19][5]=new Option("San Nicolás de los Garza ","San Nicolás de los Garza ");
group[19][6]=new Option("San Pedro Garza García ","San Pedro Garza García ");
group[19][7]=new Option("Santa Catarina ","Santa Catarina ");
group[20][0]=new Option("02 -- Ciudad","0");
group[20][1]=new Option("Ajalpan","Ajalpan");
group[20][2]=new Option("Atlixco","Atlixco");
group[20][3]=new Option("Cholula ","Cholula ");
group[20][4]=new Option("Puebla ","Puebla ");
group[20][5]=new Option("Tehuacán ","Tehuacán ");
group[20][6]=new Option("Xicotepec ","Xicotepec ");
group[21][0]=new Option("02 -- Ciudad","0");
group[21][1]=new Option("Huatulco ","Huatulco ");
group[21][2]=new Option("Oaxaca ","Oaxaca ");
group[21][3]=new Option("Salina Cruz ","Salina Cruz ");
group[21][4]=new Option("Tuxtepec","Tuxtepec");
group[21][5]=new Option("Villa Chalcatongo de Hidalgo","Villa Chalcatongo de Hidalgo");
group[22][0]=new Option("02 -- Ciudad","0");
group[22][1]=new Option("Querétaro ","Querétaro ");
group[22][2]=new Option("San Juan del Río ","San Juan del Río ");
group[22][3]=new Option("Tequisquiapan ","Tequisquiapan ");
group[23][0]=new Option("02 -- Ciudad","0");
group[23][1]=new Option("Cancún ","Cancún ");
group[23][2]=new Option("Chetumal ","Chetumal ");
group[23][3]=new Option("Cozumel ","Cozumel ");
group[23][4]=new Option("Felipe Carrillo Puerto","Felipe Carrillo Puerto");
group[23][5]=new Option("Playa del Carmen","Playa del Carmen");
group[24][0]=new Option("02 -- Ciudad","0");
group[24][1]=new Option("Cd. Valles ","Cd. Valles ");
group[24][2]=new Option("Matehuala ","Matehuala ");
group[24][3]=new Option("San Luis Potosí ","San Luis Potosí ");
group[25][0]=new Option("02 -- Ciudad","0");
group[25][1]=new Option("Culiacán ","Culiacán ");
group[25][2]=new Option("Los Mochis ","Los Mochis ");
group[25][3]=new Option("Mazatlán ","Mazatlán ");
group[25][4]=new Option("Rosario ","Rosario ");
group[26][0]=new Option("02 -- Ciudad","0");
group[26][1]=new Option("Caborca","Caborca");
group[26][2]=new Option("Cananea","Cananea");
group[26][3]=new Option("Cd. Obregón ","Cd. Obregón ");
group[26][4]=new Option("Guaymas ","Guaymas ");
group[26][5]=new Option("Hermosillo ","Hermosillo ");
group[26][6]=new Option("Navojoa","Navojoa");
group[26][7]=new Option("Nogales ","Nogales ");
group[26][8]=new Option("Ures","Ures");
group[27][0]=new Option("02 -- Ciudad","0");
group[27][1]=new Option("Cardenas","Cardenas");
group[27][2]=new Option("Comalcalco ","Comalcalco ");
group[27][3]=new Option("Macuzpana ","Macuzpana ");
group[27][4]=new Option("Paraíso","Paraíso");
group[27][5]=new Option("Villahermosa ","Villahermosa ");
group[28][0]=new Option("02 -- Ciudad","0");
group[28][1]=new Option("Altamira ","Altamira ");
group[28][2]=new Option("Cd. Madero ","Cd. Madero ");
group[28][3]=new Option("Cd. Victoria ","Cd. Victoria ");
group[28][4]=new Option("Matamoros ","Matamoros ");
group[28][5]=new Option("Nuevo Laredo ","Nuevo Laredo ");
group[28][6]=new Option("Reynosa ","Reynosa ");
group[28][7]=new Option("Tampico ","Tampico ");
group[29][0]=new Option("02 -- Ciudad","0");
group[29][1]=new Option("Apetatitlan","Apetatitlan");
group[29][2]=new Option("Apizaco ","Apizaco ");
group[29][3]=new Option("Huamantla ","Huamantla ");
group[29][4]=new Option("Muños de Domingo Arenas","Muños de Domingo Arenas");
group[29][5]=new Option("Tlaxcala ","Tlaxcala ");
group[30][0]=new Option("02 -- Ciudad","0");
group[30][1]=new Option("Alvarado","Alvarado");
group[30][2]=new Option("Boca del Rio","Boca del Rio");
group[30][3]=new Option("Cd. Mendoza ","Cd. Mendoza ");
group[30][4]=new Option("Coatzacoalcos ","Coatzacoalcos ");
group[30][5]=new Option("Córdoba ","Córdoba ");
group[30][6]=new Option("Fortín de las Flores ","Fortín de las Flores ");
group[30][7]=new Option("Ixhuatlán del café","Ixhuatlán del café");
group[30][8]=new Option("Jalapa ","Jalapa ");
group[30][9]=new Option("Martinez de la Torre","Martinez de la Torre");
group[30][10]=new Option("Minatitlán ","Minatitlán ");
group[30][11]=new Option("Nautla ","Nautla ");
group[30][12]=new Option("Orizaba ","Orizaba ");
group[30][13]=new Option("Poza Rica ","Poza Rica ");
group[30][14]=new Option("Tuxpan ","Tuxpan ");
group[30][15]=new Option("Veracruz ","Veracruz ");
group[31][0]=new Option("02 -- Ciudad","0");
group[31][1]=new Option("Mérida ","Mérida ");
group[31][2]=new Option("Valladolid ","Valladolid ");
group[32][0]=new Option("02 -- Ciudad","0");
group[32][1]=new Option("Fresnillo ","Fresnillo ");
group[32][2]=new Option("Jerez","Jerez");
group[32][3]=new Option("Sombrerete ","Sombrerete ");
group[32][4]=new Option("Zacatecas ","Zacatecas ");
group[33][0]=new Option("02 -- Ciudad","0");
group[33][1]=new Option("Otra ciudad","Otra ciudad");
group[34][0]=new Option("02 -- Ciudad","0");
group[34][1]=new Option("02 -- Ciudad","02 -- Ciudad");
var temp=document.forma1.ciudad
function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options=new Option(group[x].text,group[x].value)
}
temp.options[0].selected=true
}
//-->
</script>
</td>
</tr>
<tr>
<td><input name="button" type="button" onClick="Valida()" value="Clic para finalizar registro" ></td>
</tr>
</table>
</form>
</body>
</html>
Ya baje uno de inter net que hace lo que quiero lo malo es que son como 5 archivos entre .php y .js
http://www.ashleyit.com/rs/
Respuesta
Entre el <head> y el </head> pon este javascript:
<script type="text/JavaScript">
<!--
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
//-->
</script>
Luego el codigo del jump debería ser algo asi:
<form name="form1" id="form1">
<select name="Continentes" onchange="MM_jumpMenu('parent',this,0)">
<option value="?Continente=algunvalor">texto</option>
</select>
</form>
Claro que cada opción la imprimes con un bucle reccorriendo los continentes,
¿verás qué el valor es? Continente=algunvalor
Entonces pasará la clave primaria a la misma página y se recarga, lo que harías sería comprobar que Continente! ="" Si es así utilizas ese valor para seleccionar los países de ese continente, lo mismo para las ciudades.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas