Foros del Web » Programando para Internet » PHP »

[APORTE] - Select dependiente (3 niveles)

Estas en el tema de [APORTE] - Select dependiente (3 niveles) en el foro de PHP en Foros del Web. Amigos, Como ya sabemos el tema es bastante solicitado por todos los integrantes de FDW, aprovecho que tuve que hacer un sistema con tres listas ...
  #1 (permalink)  
Antiguo 06/02/2014, 09:53
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
[APORTE] - Select dependiente (3 niveles)

Amigos,
Como ya sabemos el tema es bastante solicitado por todos los integrantes de FDW, aprovecho que tuve que hacer un sistema con tres listas desplegables dependientes y les dejo aqui toda la informacion.

MySQL + AJAX + PHP

3 tablas (provincias - municipios - consejos)

Código MySQL:
Ver original
  1. DROP TABLE IF EXISTS `nm_provincias`;
  2. CREATE TABLE `nm_provincias` (
  3.   `id` int(11) NOT NULL auto_increment,
  4.   `provincia` varchar(50) NOT NULL,
  5.   PRIMARY KEY  (`id`)


Código MySQL:
Ver original
  1. DROP TABLE IF EXISTS `nm_municipios`;
  2. CREATE TABLE `nm_municipios` (
  3.   `id` int(10) NOT NULL auto_increment,
  4.   `idprovincia` varchar(5) default NULL,
  5.   `municipio` varchar(50) default NULL,
  6.   PRIMARY KEY  (`id`)


Código MySQL:
Ver original
  1. DROP TABLE IF EXISTS `nm_consejos`;
  2. CREATE TABLE `nm_consejos` (
  3.   `id` int(10) NOT NULL auto_increment,
  4.   `idmunicipio` varchar(5) default NULL,
  5.   `consejos` varchar(70) default NULL,
  6.   PRIMARY KEY  (`id`)
  #2 (permalink)  
Antiguo 06/02/2014, 09:55
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

conexion.php

Código PHP:
Ver original
  1. $db_host = "localhost";
  2. $db_usuario = "usuario";
  3. $db_password = "clave";
  4. $db_base = "listas";
  5. $mysqli = new mysqli($db_host, $db_usuario, $db_password, $db_base);
  6. $mysqli->query("SET NAMES 'utf8'");
  7. echo mysql_error();
  #3 (permalink)  
Antiguo 06/02/2014, 09:57
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

index.php

Código PHP:
Ver original
  1. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  2. <script type="text/javascript" language="javascript" src="ajax.js"></script>
  3. <body>
  4. <table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
  5.   <tr align="left">
  6.     <td width="25%">Provincia:</td>
  7.     <td width="30%">Municipio:</td>
  8.     <td width="45%">Consejo popular:</td>
  9.   </tr>
  10.   <tr align="left">
  11.     <td><?php include('provincias.php'); ?></td>
  12.     <td><div id="listamunicipios">
  13.       <select name="obj_municipio" id="obj_municipio" >
  14.         <option>Seleccionar...</option>
  15.       </select>
  16.     </div></td>
  17.     <td><table border="0" cellspacing="0" cellpadding="0">
  18.       <tr>
  19.         <td><div id="listaconsejos">
  20.           <select name="obj_consejos" id="obj_consejos">
  21.             <option>Seleccionar...</option>
  22.           </select>
  23.         </div></td>
  24.         <td></td>
  25.       </tr>
  26.     </table></td>
  27.   </tr>
  28. </table>
  29. </body>
  30. </html>
  #4 (permalink)  
Antiguo 06/02/2014, 10:00
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

provincias.php

Código PHP:
Ver original
  1. <select id="obj_provincia" onchange="mostrarMunicipios()">
  2. <option value="">Seleccionar...</option>
  3. <?php
  4. require('conexion.php');
  5. $rs_prov = $mysqli->query("SELECT * FROM nm_provincias");
  6. while($row_prov = $rs_prov->fetch_assoc()){
  7. ?>                        
  8. <option value="<?php echo $row_prov['id']; ?>"><?php echo $row_prov['provincia']; ?></option>
  9. <?php } ?>                          
  10. </select>


municipios.php

Código PHP:
Ver original
  1. <select id="obj_municipio" onchange="mostrarConsejos()">
  2. <option value="">Seleccionar...</option>
  3. <?php
  4. require('conexion.php');
  5. $rs_mun = $mysqli->query("SELECT * FROM nm_municipios WHERE idprovincia='".$_POST['idprov']."'");
  6. while($row_mun = $rs_mun->fetch_assoc()){
  7. ?>                        
  8. <option value="<?php echo $row_mun['id']; ?>"><?php echo $row_mun['municipio']; ?></option>
  9. <?php } ?>                          
  10. </select>


consejos.php

Código PHP:
Ver original
  1. <select id="obj_consejos">
  2. <option value="">Seleccionar...</option>
  3. <?php
  4. require('conexion.php');
  5. $rs_cp = $mysqli->query("SELECT * FROM nm_consejos WHERE idmunicipio='".$_POST['idmun']."'");
  6. while($row_cp = $rs_cp->fetch_assoc()){
  7. ?>                        
  8. <option value="<?php echo $row_cp['id']; ?>"><?php echo $row_cp['consejos']; ?></option>
  9. <?php } ?>                          
  10. </select>
  #5 (permalink)  
Antiguo 06/02/2014, 10:03
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

FINALMENTE:

ajax.js

Código Javascript:
Ver original
  1. //========================
  2. //CREACION DEL OBJETO AJAX
  3. //========================
  4. function objetoAjax(){
  5.     var xmlhttp=false;
  6.     try {
  7.         xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  8.     } catch (e) {
  9.         try {
  10.            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  11.         } catch (E) {
  12.             xmlhttp = false;
  13.         }
  14.     }
  15.  
  16.     if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
  17.         xmlhttp = new XMLHttpRequest();
  18.     }
  19.     return xmlhttp;
  20. }
  21.  
  22. //==================
  23. function mostrarMunicipios(){
  24.  
  25.     divResultado = document.getElementById('listamunicipios');
  26.     prov=document.getElementById('obj_provincia').value;
  27.  
  28.     ajax=objetoAjax();
  29.     ajax.open("POST", "municipios.php");
  30.     ajax.onreadystatechange=function() {
  31.         if (ajax.readyState==4) {
  32.             divResultado.innerHTML = ajax.responseText
  33.         }
  34.     }
  35.     ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  36.     ajax.send("idprov="+prov)
  37. }
  38.  
  39.  
  40. //==================
  41. function mostrarConsejos(){
  42.  
  43.     divResultado = document.getElementById('listaconsejos');
  44.     mun=document.getElementById('obj_municipio').value;
  45.  
  46.     ajax=objetoAjax();
  47.     ajax.open("POST", "consejos.php");
  48.     ajax.onreadystatechange=function() {
  49.         if (ajax.readyState==4) {
  50.             divResultado.innerHTML = ajax.responseText
  51.         }
  52.     }
  53.     ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  54.     ajax.send("idmun="+mun)
  55. }
  #6 (permalink)  
Antiguo 06/02/2014, 10:12
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

Solo resta hacer el completamiento de la base de datos, para esto es aconsejable hacer un manager, para introducir las provincias, municipios y consejos de forma tal que cada cual tome el identificador del lugar que le precede.
  #7 (permalink)  
Antiguo 06/02/2014, 11:48
Avatar de jonni09lo
Colaborador
 
Fecha de Ingreso: septiembre-2011
Ubicación: Estigia
Mensajes: 1.471
Antigüedad: 8 años
Puntos: 396
Respuesta: [APORTE] - Select dependiente (3 niveles)

Hola, algunas correcciones:

No veo que relaciones con FK las diferentes tablas de la base de datos algo que considero de que es fundamental. A parte de que si el id de provincias es 11 y lo declaras como INT, el idprovincia de municipios debe de ser un INT y con el mismo tamaño que la tabla padre (11), lo mismo ocurre con los consejos.

Si usas mysqli no veo necesidad de esta línea:

Cita:
Iniciado por alexisverano Ver Mensaje
Código PHP:
Ver original
  1. echo mysql_error();
Te recomiendo que si vas a mostrar un ejemplo de una página completa le pongas el DOCTYPE y un head ya que la etiqueta meta debe de ir dentro de esta.

Cita:
Iniciado por alexisverano Ver Mensaje
index.php

Código PHP:
Ver original
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="utf-8" />
  5.     <script type="text/javascript" language="javascript" src="ajax.js"></script>
  6. </head>
  7. <body>
  8. <table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
  9.   <tr align="left">
  10.     <td width="25%">Provincia:</td>
  11.     <td width="30%">Municipio:</td>
  12.     <td width="45%">Consejo popular:</td>
  13.   </tr>
  14.   <tr align="left">
  15.     <td><?php include('provincias.php'); ?></td>
  16.     <td><div id="listamunicipios">
  17.       <select name="obj_municipio" id="obj_municipio" >
  18.         <option>Seleccionar...</option>
  19.       </select>
  20.     </div></td>
  21.     <td><table border="0" cellspacing="0" cellpadding="0">
  22.       <tr>
  23.         <td><div id="listaconsejos">
  24.           <select name="obj_consejos" id="obj_consejos">
  25.             <option>Seleccionar...</option>
  26.           </select>
  27.         </div></td>
  28.         <td></td>
  29.       </tr>
  30.     </table></td>
  31.   </tr>
  32. </table>
  33. </body>
  34. </html>
El require_once lo puedes colocar en el index en vez de cada include... creo que es más óptimo por mantenimiento de código

Saludos
__________________
Haz preguntas inteligentes-Como ser Hacker
No hacer preguntas por mensaje privado. No sólo no es inteligente sino que es egoísta.
  #8 (permalink)  
Antiguo 12/02/2014, 08:51
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

Cita:
Iniciado por jonni09lo Ver Mensaje
El require_once lo puedes colocar en el index en vez de cada include... creo que es más óptimo por mantenimiento de código
Esto, en un inicio lo tenia asi, pero no funcionaba, lo tuve que poner en los tres includes, para que funcionara.
  #9 (permalink)  
Antiguo 12/02/2014, 08:58
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

Cita:
Iniciado por jonni09lo Ver Mensaje
No veo que relaciones con FK las diferentes tablas de la base de datos algo que considero de que es fundamental...
No veo necesidad de esto, ya que de la forma que esta funcionado, lo que yo hago es capturar el ID de cada elemento en la lista y pasarlo con AJAX hacia el SELECT de la otra lista por POST.

De todos modos, "jonni09lo", si tienes mas sugerencias enviamelas para hacer mas eficiente los select dependientes.

Gracias...
  #10 (permalink)  
Antiguo 12/02/2014, 09:05
Avatar de alexisverano  
Fecha de Ingreso: septiembre-2008
Ubicación: La Habana.Cuba
Mensajes: 298
Antigüedad: 11 años
Puntos: 36
Respuesta: [APORTE] - Select dependiente (3 niveles)

Con la modificacion de la extructura de las tablas, quedarian asi.


Código SQL:
Ver original
  1. CREATE TABLE IF NOT EXISTS `nm_provincias` (
  2.   `id` INT(11) NOT NULL AUTO_INCREMENT,
  3.   `provincia` VARCHAR(50) NOT NULL,
  4.   PRIMARY KEY (`id`)
  5. ) ENGINE=InnoDB  DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;

Código SQL:
Ver original
  1. CREATE TABLE IF NOT EXISTS `nm_municipios` (
  2.   `id` INT(11) NOT NULL AUTO_INCREMENT,
  3.   `idprovincia` INT(11) DEFAULT NULL,
  4.   `municipio` VARCHAR(50) DEFAULT NULL,
  5.   PRIMARY KEY (`id`)
  6. ) ENGINE=InnoDB  DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;

Código SQL:
Ver original
  1. CREATE TABLE IF NOT EXISTS `nm_consejos` (
  2.   `id` INT(11) NOT NULL AUTO_INCREMENT,
  3.   `idmunicipio` INT(11) DEFAULT NULL,
  4.   `consejos` VARCHAR(70) DEFAULT NULL,
  5.   PRIMARY KEY (`id`)
  6. ) ENGINE=InnoDB  DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;
  #11 (permalink)  
Antiguo 12/02/2014, 09:08
Avatar de jonni09lo
Colaborador
 
Fecha de Ingreso: septiembre-2011
Ubicación: Estigia
Mensajes: 1.471
Antigüedad: 8 años
Puntos: 396
Respuesta: [APORTE] - Select dependiente (3 niveles)

Pues hasta que no corrijas los errores que te comenté pues no sé que más podría surgir.

Y sobre la base de datos, dices que no ves necesidad, pero si un analista de bases de datos ve lo que hiciste, de seguro se quedará medio calvo

La razón es simple, consistencia de datos, las correcciones que te dí son en aras de las buenas prácticas.

Mira este tema, de seguro te ayudará a entender un poco más la necesidad y utilidad a la hora de usar FK.

Saludos
__________________
Haz preguntas inteligentes-Como ser Hacker
No hacer preguntas por mensaje privado. No sólo no es inteligente sino que es egoísta.
  #12 (permalink)  
Antiguo 26/02/2014, 04:12
 
Fecha de Ingreso: febrero-2014
Ubicación: Alicante
Mensajes: 1
Antigüedad: 5 años, 6 meses
Puntos: 0
Respuesta: [APORTE] - Select dependiente (3 niveles)

Hola soy nuevo en esto, pero he cogido todos los archivos aquí descritos y he cambiado los parámetros de acceso a bd, tablas y columnas y no me funciona.

(No he probado a hacerlo tal cual aparece aquí con los datos de bd, tablas y columnas que se plantean)

En el index.php, me aparece sólo el selec de provincias pero no me lee ningún dato de la tabla a la que le pido.

Si lo hago todo en php consigo hacer un combobox dependiente a dos niveles, y funciona perfectamente sin usar js (del que no tengo ni idea).
  #13 (permalink)  
Antiguo 11/05/2014, 16:25
 
Fecha de Ingreso: mayo-2014
Ubicación: Santo Domingo
Mensajes: 1
Antigüedad: 5 años, 4 meses
Puntos: 1
Respuesta: [APORTE] - Select dependiente (3 niveles)

Muchas gracias "alexisverano". Soy nuevo en php y tengo semanas buscando un codigo como este que contenga: 3 Select y usando MYSQLI. Mil gracias. Solo para citar lo importante que son estos aportes es importante decirte que me motive a Registrarme a este Foto principalmente para agradecer este tipo de aportes.
  #14 (permalink)  
Antiguo 19/09/2014, 06:06
 
Fecha de Ingreso: mayo-2009
Mensajes: 166
Antigüedad: 10 años, 3 meses
Puntos: 2
Respuesta: [APORTE] - Select dependiente (3 niveles)

Ésto sirve también para hacer 4 o 5 niveles no?

Etiquetas: dependiente, mysql, select, tabla
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 5 personas




La zona horaria es GMT -6. Ahora son las 18:39.