buenas tardes, tengo el siguiente codigo anexo mas adelante, resulta que necesito que un campo select al momento de escojerse un nombre automaticamente se muestre los campos correspondientes a dicho nombre en el siguiente select... que pasa.. bueno el codigo sin formato php me funciona perfectamente pero el problema viene mas adelante... necesito que estos campos select me funcionen 100% con datos de mi base de datos tal cual que al momento de seleccionar por ejemplo en el select 1 algun campo de la base de datos el mismo me ubique en el segundo select solo los campos que corresponden al campo anteriormente seleccionado, me imagino que esto se logra por medio del ID... bueno el problema que tengo a continuacion es que en el momento que agrego php de consulta al primer select me funciona, arreglo el javascript y bien todo bien hasta alli, pero cuando en el segundo select agrego php :S de inmediato se daña no funciona la consulta... se que tengo parte del codigo mal, podrian por favor ayudarme es urgente... muchas gracias por leer mi consulta.
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
//<![CDATA[
function getcategoria(tipo)
{
var categoria;
//categoria = document.getElementById('tipo');
categoria = tipo.value;
document.getElementById('hotel').style.display='none';
document.getElementById('pension').style.display='none';
document.getElementById('ABC').style.display='none';
document.getElementById('casarural').style.display='none';
document.getElementById('museo').style.display='none';
document.getElementById('arquitectura').style.display='none';
document.getElementById('otrosespacios').style.display='none';
document.getElementById('tiendasropa').style.display='none';
document.getElementById('bares').style.display='none';
document.getElementById('pub').style.display='none';
document.getElementById('restaurante').style.display='none';
document.getElementById('termalismo').style.display='none';
switch(categoria)
{
case 'Hotel':
document.getElementById('hotel').style.display='block';
break;
case "Pension":
document.getElementById('pension').style.display='block';
break;
case "ABC":
document.getElementById('ABC').style.display='block';
break;
case "Casa Rural":
document.getElementById('casarural').style.display='block';
break;
case "Museo":
document.getElementById('museo').style.display='block';
break;
case "Arquitectura":
document.getElementById('arquitectura').style.display='block';
break;
case "Otros espacios":
document.getElementById('otrosespacios').style.display='block';
break;
case "Tiendas de ropa":
document.getElementById('tiendasropa').style.display='block';
break;
case "Bares y cafeterias":
document.getElementById('bares').style.display='block';
break;
case "Pubs":
document.getElementById('pub').style.display='block';
break;
case "Restaurante":
document.getElementById('restaurante').style.display='block';
break;
case "Termalismo":
document.getElementById('termalismo').style.display='block';
break;
}
}
//]]>
</script>
</head>
<body>
<form name="formulario" method="post" action="procesar_marca.php" onsubmit="return validar()">
<div id="nombre">
<table><tr><td>
<label>Nombre:</label>
<label><input name="nombre" type="text" size="50" /></label>
</td></tr><tr><td>
<label>Tipo:</label>
<label><select name="tipo" id="tipo" onchange="getcategoria(this);">
<option selected value="Hotel">Hotel</option>
<option value="Pension">Pension</option>
<?
include ("conexion.php");
$sql="SELECT * FROM cursos";
$resultado=mysql_query($sql) or die(mysql_error());
while ($row=mysql_fetch_array($resultado)){
echo "<option value=\"".ABC."\">".$row['curso']."</option>\n";
}
mysql_close($link); //cierra la conexion
?>
<option value="Casa Rural">Casa Rural</option>
<option value="Museo">Museo</option>
<option value="Arquitectura">Arquitectura</option>
<option value="Otros espacios">Otros espacios</option>
<option value="Tiendas de ropa">Tiendas de ropa</option>
<option value="Bares y cafeterias">Bares y cafeterias</option>
<option value="Pubs">Pubs</option>
<option value="Restaurante">Restaurante</option>
<option value="Termalismo">Termalismo</option>
</select>
</label>
</td></tr></table>
</div>
<div id="hotel" style="display:block;">
<label>Categoria:</label>
<label><select name="cathotel" >
<option selected>4 Estrellas</option>
<option>3 Estrellas</option>
<option>2 Estrellas</option>
<option>1 Estrella</option>
</select>
</label>
</div>
<div id="pension" style="display:none;">
<label>Categoria:</label>
<label><select name="catpension" >
<option selected>3 Estrellas</option>
<option>2 Estrellas</option>
<option>1 Estrella</option>
</select>
</label>
</div>
<div id="ABC" style="display:none;">
<label>Categoria:</label>
<label><select name="catABC" >
<?
$sql="SELECT nivel FROM cursos";
$resultado=mysql_query($sql) or die(mysql_error());
while ($row=mysql_fetch_array($resultado)){
echo "<option>".$row['nivel']."</option>\n";
}
?>
</select>
</label>
</div>
<div id="casarural" style="display:none;">
<label>Categoria:</label>
<label><select name="catcasarural" >
<option selected>Grupo A</option>
<option>Grupo B</option>
<option>Grupo C</option>
</select>
</label>
</div>
<div id="museo" style="display:none;">
<label>Categoria:</label>
<label><select name="catmuseo" >
<option selected>Arqueológico</option>
<option>Cera</option>
<option>Temático</option>
</select>
</label>
</div>
<div id="arquitectura" style="display:none;">
<label>Categoria:</label>
<label><select name="catarquitectura" >
<option selected>Catedral</option>
<option>Iglesia</option>
<option>Centro Histórico</option>
<option>Puente</option>
<option>Edificio</option>
</select>
</label>
</div>
<div id="otrosespacios" style="display:none;">
<label>Categoria:</label>
<label><select name="catotrosespacios" >
<option selected>Estatua</option>
<option>Parque</option>
<option>Exposición</option>
</select>
</label>
</div>
<div id="tiendasropa" style="display:none;">
<label>Categoria:</label>
<label><select name="cattiendasropa" >
<option selected>Deporte</option>
<option>Informal</option>
</select>
</label>
</div>
<div id="bares" style="display:none;">
<label>Categoria:</label>
<label><select name="catbares" >
<option selected>Bar</option>
<option>Cafeteria</option>
</select>
</label>
</div>
<div id="pub" style="display:none;">
<label>Categoria:</label>
<label><select name="catpub" >
<option selected>Primera hora</option>
<option>Última hora</option>
</select>
</label>
</div>
<div id="restaurante" style="display:none;">
<label>Categoria:</label>
<label><select name="catrestaurante" >
<option selected>3 tenedores</option>
<option>2 tenedores</option>
<option>1 tenedor</option>
</select>
</label>
</div>
<div id="termalismo" style="display:none;">
<label>Categoria:</label>
<label><select name="cattermalismo" >
<option selected>Gratis</option>
<option>Pago</option>
</select>
</label>
</div>
<div>
<table><tr><td>
<label align="top">Descripcion Breve:</label></td><td>
<label><textarea name="descripcion" cols="25" rows="5"></textarea></label>
</td></tr>
<tr><td>
<label>Foto cabecera</label></td><td>
<label><input type="file" name="foto" /></label>
</td></tr>
<tr><td>
<label>Descripcion:</label></td><td>
<label><textarea name="descripcion" cols="50" rows="19"></textarea></label>
</td></tr>
<tr><td>
<label>Latitud:</label></td><td>
<label><input type="text" name="lat" /></label>
</td></tr>
<tr><td>
<label>Longitud:</label></td><td>
<label><input type="text" name="lng" /></label>
</td></tr>
<tr><td>
<input type="submit" name="enviar" value="Enviar formulario" /></td><td>
<input type="reset" name="vaciar" value="Vaciar" />
</td></tr>
</table>
</div>
</form>
</body>
</html>