Listas dinámicas enlazadas

Pues, con HTML unicamente no se puede ya que HTML es un lenguaje estatico.

Podrias usar PHP que es dinamic, pero bueno tampoco podras hacerlo con PHP ya que se ejecuta en el servidor y tu requieres de una accion en el navegador para cargar la segunda lista.

Y bien, si hablamos de lenguajes para interactuar con el usuario eso es JavaScript, pero claro bueno no funciona tampoco ya que JavaScript no puede ir a tu base de datos.

Otra forma es usar AJAX o acrónimo de Asynchronous JavaScript And XML (JavaScript y XML asíncronos, donde XML es un acrónimo de eXtensible Markup Language)

http://es.wikipedia.org/wiki/AJAX

que no es un lenguaje es mas bien la nueva forma de llamarle a la mexcla de esos lenguajes como XML, JavaScript, HTML, etc pero lo haremos sin el nombrete raro.

Y ahora paso a explicar la solución a lo que preguntas :)

Como elementos HTML importantes vamos a tener 3 elementos importantes, estos son:

frmDatos que es el formulario que contiene las listas

selCiudades que es la lista donde seleccionas las ciudades

selPropiedades que es la lista donde seleccionas las propiedades

El formulario, es bien simple y se ve como el link que puse arriba. El codigo HTML del mismo seria asi:

<form id="frmDatos" name="frmDatos" method="post" action="">
<label>Ciudades:
<select name="selCiudades" size="6" id="selCiudades">
</select>
</label>
<label>Propiedades:
<select name="selPropiedades" size="6" id="selPropiedades">
</select>
</label>
</form>

Tu lo puedes escribir o generar con DreamWeaver, lo importante es el nombre de las 2 listas y el formulario (selCiudades, selPropiedades, frmDatos).

Simple no ?? :P

Bien, el siguiente tema es que según dices debes cargar la información desde una base de datos, yo en mi ejemplo cargare las ciudades desde la base de datos y la tabla ciudades (explicada en el tutorial de bienes raíces).

La lista de Propiedades no se carga en este momento ya que es producto del resultado de seleccionar una Ciudad, por tanto lo primero y unico que cargaremos ahora son las ciudades.

Para cargar las ciudades debemos agregar codigo PHP que permita leer esas ciudades desde la tabla ciudades de la base de datos :), o sea que al HTML lo modificamos para que quede asi:

<label>Ciudades:
<select name="selCiudades" size="6" id="selCiudades">
<?php
$tablaCiudades = mysql_query('SELECT * FROM ciudades ORDER BY nombre ASC');
while ($registroCiudad = mysql_fetch_array($tablaCiudades)) {
?>
<option value="<?php echo $registroCiudad['id']; ?>"><?php echo $registroCiudad['nombre']; ?></option>
<?php
}
mysql_free_result($tablaCiudades);
?>
</select>
</label>

Usuarios que han visto este tema también han visto...

- Como hacer un Ticker
- Euroconversor en Javascript
- Pop-Up para imágenes en un mismo archivo en JavaScript
- Rollover con javascript
- Detectar Navegador

- Versión imprimible de este documento

- Enviar por e-mail este documento