Inicio > Listas desplegables, MySql, Php5 > Listas desplegables llenadas dinámicamente (tag select) 1er. Caso

Listas desplegables llenadas dinámicamente (tag select) 1er. Caso

Jueves, 22 de Mayo de 2008 admin Dejar un comentario Ir a comentarios

Luego de ver la parte introductoria de este tema, el primer caso es cargar la página en una primera oportunidad para luego de escoger un departamento, se cargue la página nuevamente y tener las provincias para ese departamento, empezaremos primero creando nuestras tablas en mysql (nombre de la base de datos es bd_anidados), este sería el script:

CREATE TABLE departamento (
coddep TINYINT UNSIGNED NOT NULL AUTO_INCREMENT,
desdep VARCHAR(30) NOT NULL,
PRIMARY KEY(coddep)
);

CREATE TABLE provincia (
codpro SMALLINT UNSIGNED NOT NULL AUTO_INCREMENT,
despro VARCHAR(50) NOT NULL,
coddep TINYINT UNSIGNED NOT NULL,
PRIMARY KEY(codpro),
INDEX coddep(coddep)
);

Los datos lo llenan a su gusto…, primero llenen el departamento, registren los nombres, luego dependiendo del id que coloca el departamento llenan las provincias el nombre y a que departamento pertenece (coddep), al ser autoincrement ambas tablas le generá su id o identificador de tabla…, pueden tomar como referencia los datos de su localidad, estados, regiones, distritos, etc, uds vean.

El primer caso es cargar la página con la primera lista desplegable llena con los departamentos.

anidado1.php

< ?php  // primer bloque php
if (isset($_POST['sDep']))
$coddep=$_POST['sDep'];
else
$coddep=-1;
?>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Select anidado 1</title>
</head>

<body>
<form name="f1" action="anidado1.php" method="post">
<b>Departamentos :      Provincias</b><br />
<select name="sDep" onchange="javascript:f1.submit();">
<option value="-1">Seleccione</option>
< ?php  // segundo bloque php
/* Conectamos a los datos */
$cn = mysql_connect("localhost","usuario","clave");
mysql_select_db("bd_anidados");
$sql="SELECT * FROM departamento";
$rs=mysql_query($sql);
while ($reg=mysql_fetch_assoc($rs)) {  // departamentos
$cd=$reg['coddep'];	// código departamento
$dd=$reg['desdep'];	// descripción departamento
if ($coddep==$cd)
echo "<option value=$cd selected>$dd";
else
echo "<option value=$cd>$dd</option>";
}
?>
</select>
<select name="sPro">
< ?php  // tercer bloque php
if ($coddep==-1) {
echo "<option value=-1>Escoge departamento";
}
else {
$sql="SELECT * FROM provincia WHERE coddep=$coddep";
$rs=mysql_query($sql);
while ($reg=mysql_fetch_assoc($rs)) {  provincias
$cp=$reg['codpro'];	// código provincia
$dp=$reg['despro'];	// descripción provincia
echo "<option value=$cp>$dp</option>";
}
}
?>
</select>
</form>
</body>
</html>

Esta forma como les decía realiza doble carga de la página, y en caso tengamos más de un caso de listas deplegables en nuestra página como que vamos a demorar, a parte de que tendríamos que controlar cada carga de página, haría crecer nuestro código.

¿Cuál es la idea?, en la primera carga debemos tener la primera lista con los departamentos, en la segunda carga se llenará el segundo select con las provincias de acuerdo al departamento seleccionado y para evitar perder la descripción del departamento del primer select necesitamos ubicarlo y seleccionarlo.

Viendo esto es importante saber cuando es primera o segunda carga, para lo cual es necesario utilizar un flag o bandera con un valor que indique ello, utilizaremos para nuestro caso la variable PHP $_POST, que sólo aparece cuando se hace la segunda carga

Por pasos:

El primer bloque php creamos el flag o bandera en la variable $coddep, si es -1 es primera carga de lo contrario al tener un valor es la segunda carga.

En el segundo bloque php llenaremos la primera lista de acuerdo a los datos de la tabla departamento, la condición if nos sirve para no perder la descripción del departamento en la segunda carga.

El tercer y último bloque llena el segundo select, si es primera carga, sólo nos muestra un elemento con un mensaje, la segunda realiza la carga de las provincias de acuerdo al departamento seleccionado.

Lioso ¿no? hasta para explicar.

Hasta pronto para ver el próximo caso.

Ver demostración

Descargar archivos

Categories: Listas desplegables, MySql, Php5 Tags:
  1. Eduardo
    Sábado, 21 de Noviembre de 2009 a las 14:19 | #1

    Gracias por el aporte, esta buscando algo asi por la red.

  2. paolo machado
    Lunes, 26 de Octubre de 2009 a las 19:03 | #2

    Hola Antonio, gracias por tu super aporte.
    Pero tengo una duda creo que interesante.
    Que sucederia si todo ello esta en una sola tabla.
    Qué tanto cambiaria el algoritmo?

    Espero puedas ejemplificarlo como tan bien haces.

    Gracias!

  3. harold ocaña
    Viernes, 3 de Octubre de 2008 a las 20:54 | #3

    Muchas gracias

    Ya probé el codigo y funciona excelentemente.

  1. Sin trackbacks aún.