Foros del Web » Programando para Internet » Javascript »

Selects Dependientes

Estas en el tema de Selects Dependientes en el foro de Javascript en Foros del Web. Hola a tod@s. Supongo que este tema lo estoy poniendo en el foro correcto, si no es así por favor moverlo. Veréis tengo el siguiente ...
  #1 (permalink)  
Antiguo 25/01/2015, 02:51
 
Fecha de Ingreso: enero-2011
Ubicación: España
Mensajes: 222
Antigüedad: 13 años, 3 meses
Puntos: 7
Selects Dependientes

Hola a tod@s.

Supongo que este tema lo estoy poniendo en el foro correcto, si no es así por favor moverlo.

Veréis tengo el siguiente código que me relaciona 3 selects, dependiendo de lo que selecciono en el primero "Provincias" me rellena el segundo "Poblaciones" y dependiendo de la selección del segundo me rellena el tercero "Zonas".

El código lo saque de la red y lo modifique porque el original no funcionaba pero incluso no funciona bien del todo y me gustaría solucionar los problemas que presenta ya que nos serviría a todos para poder utilizarlo a posteriori.

Pongo la dirección donde se puede ver como funciona, en esa dirección solo existe esta parte de código con el fin de que se pueda ver como funciona.
http://www.necesitopiso.com

Primer problema cuando se selecciona una provincia y no existen poblaciones activa el Alert que lleva, lo mismo ocurre cuando se selecciona una población en la que no existen zonas definidas en la base de datos, el primer caso se da excepcionalmente, todas las provincias tienen poblaciones, pero el segundo se da con bastante frecuencia, poblaciones pequeñas que no tienen zonas definidas, por lo cual salta el alert. OJO EN LOCAL NO SALTAN LOS ALERTS. Hay una provincia que no tiene poblaciones que es "Asturias" lo he hecho a proposito para que se vea el funcionamiento.

Segundo problema si se selecciona provincia, población y zona al cambiar de provincia no se rellena con las nuevas poblaciones y con las zonas pasa lo mismo hasta que se selecciona una nueva población y lo lógico es que al cambiar de provincia, se rellene de nuevo con las poblaciones y el select zona pase a "Todas las Zonas" hasta que se seleccione una población y entonces muestre las zonas que corresponden a la población seleccionada si las tiene, si se quiere ver como funciona con poblaciones y zona seleccionar Provincia "Valencia", Población "Valencia" y aparecerán las zonas dadas de alta.

Espero que me podáis ayudar ya que en JavaScript estoy un poco verde y supongo que es ahí donde esta el problema, Gracias.

INDEX.php
Código PHP:
Ver original
  1. <?php
  2. $_SESSION["Provincia"]="Todas las provincias";
  3. $_SESSION["Poblacion"]="Todas las poblaciones";
  4. $_SESSION["Zona"]="Todas las zonas";
  5. ?>
  6.  
  7. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  8. <html xmlns="http://www.w3.org/1999/xhtml">
  9. <head>
  10. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  11. <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
  12.  
  13. <link rel="stylesheet" href="Css/Inicio.css" type="text/css">
  14.  
  15.  
  16.  
  17. <script type="text/javascript">
  18. $(document).ready(function(){
  19.     cargar_paises();
  20.     $("#selprovincia").change(function(){dependencia_estado();});
  21.     $("#estado").change(function(){dependencia_ciudad();});
  22.     $("#estado").attr("disabled",true);
  23.     $("#ciudad").attr("disabled",true);
  24. });
  25.  
  26. function cargar_paises()
  27. {
  28.     $.get("scripts/cargar-paises.php", function(resultado){
  29.         if(resultado == false)
  30.         {
  31.             alert("Este error no aparece");
  32.         }
  33.         else
  34.         {
  35.             $('#selprovincia').append(resultado);          
  36.         }
  37.     });
  38. }
  39. function dependencia_estado()
  40. {
  41.     var code = $("#selprovincia").val();
  42.     $.get("scripts/dependencia-estado.php", { code: code },
  43.         function(resultado)
  44.         {
  45.             if(resultado == false)
  46.             {
  47.                 alert("Este error es el numero 1");
  48.             }
  49.             else
  50.             {
  51.                 $("#estado").attr("disabled",false);
  52.                 document.getElementById("estado").options.length=1;
  53.                 $('#estado').append(resultado);        
  54.             }
  55.         }
  56.  
  57.     );
  58. }
  59.  
  60. function dependencia_ciudad()
  61. {
  62.     var code = $("#estado").val();
  63.     $.get("scripts/dependencia-ciudades.php?", { code: code }, function(resultado){
  64.         if(resultado == false)
  65.         {
  66.             alert("Este error es el número 2");
  67.         }
  68.         else
  69.         {
  70.             $("#ciudad").attr("disabled",false);
  71.             document.getElementById("ciudad").options.length=1;
  72.             $('#ciudad').append(resultado);        
  73.         }
  74.     });
  75.    
  76. }
  77. </script>
  78.  
  79. </head>
  80.  
  81. <?php
  82.         require_once('Connections/Inmobiliaria.php');
  83.         mysql_query("SET NAMES 'utf8'");
  84.  
  85. ?>
  86.  
  87. <body>
  88. <div id="ContenedorInicio">
  89. <div id="FondoInicio">
  90.  
  91. <div id="CajaSeleccion">
  92. <div id="BarraIzqCajaSeleccion"></div>
  93. <div id="BarraDchCajaSeleccion"></div>
  94. <div id="CabeceraCajaSeleccion">SELECCIONE la MODALIDAD, TIPO INMUEBLE, TIPO de OBRA y la PROVINCIA</div>
  95. <form name="Seleccion" id="Seleccion" method="GET"  action="Distribucion.php">
  96.  
  97.   <div id="TitularProvincia">Provincia</div>
  98.   <div id="ProvinciaInicio">
  99.          <select id="selprovincia" name="selprovincia" class="Guias3">
  100.             <option  class="MenuSelect" value="Todas las provincias">Todas las provincias</option>
  101.         </select>
  102.     </div>
  103.  
  104.     <div id="PoblacionInicio">
  105.         <select id="estado" name="estado" class="Guias3">
  106.             <option class="MenuSelect"  value="Todas las poblaciones">Todas las poblaciones</option>
  107.         </select>
  108.     </div
  109.  
  110.     ><div id="ZonaInicio">
  111.         <select id="ciudad" name="ciudad" class="Guias3">
  112.             <option class="MenuSelect"  value="Todas las Zonas">Todas las zonas</option>
  113.         </select>
  114.     </div
  115.   ><div id="BotonBuscar">
  116.   <input type="submit" name="cmdBuscar" id="cmdBuscar" value="BUSCAR LO SELECCIONADO">
  117.  
  118.   </div>
  119.   </form>
  120.  
  121. </div> <!-- Cierro CajaSeleccion-->
  122.  
  123. </div> <!-- Cierro Fondo Inicio -->
  124. <div id="DerReservadosInicio" class="Guias3">&copy;www.necesitopiso.com - Todos los derechos reservados 2014 -2015</div>
  125. </div><!-- Cierro ContenedorInicio -->
  126. </body>
  127. </html>

SCRIPT/cargar-países.php
Código PHP:
Ver original
  1. <?php
  2. include("clases/class.mysql.php");
  3. include("clases/class.combos.php");
  4. $selects = new selects();
  5. $paises = $selects->cargarPaises();
  6. foreach($paises as $key=>$value)
  7. {
  8.         echo "<option value=\"$key\">$value</option>";
  9. }
  10. ?>

SCRIPT/Dependencia-ciudades.php
Código PHP:
Ver original
  1. <?php
  2. include("clases/class.mysql.php");
  3. include("clases/class.combos.php");
  4. $ciudades = new selects();
  5. $ciudades->code = $_GET["code"];
  6. $ciudades = $ciudades->cargarCiudades();
  7. foreach($ciudades as $key=>$value)
  8. {
  9.         echo "<option value=\"$key\">$value</option>";
  10. }
  11. ?>

SCRIPT/Dependencia-estado.php
Código PHP:
Ver original
  1. <?php
  2. include("clases/class.mysql.php");
  3. include("clases/class.combos.php");
  4. $estados = new selects();
  5. $estados->code = $_GET["code"];
  6. $estados = $estados->cargarEstados();
  7. foreach($estados as $key=>$value)
  8. {
  9.         echo "<option value=\"$key\">$value</option>";
  10. }
  11. ?>

CLASES/Class.combos.php
Código PHP:
Ver original
  1. <?php
  2.  
  3. class selects extends MySQL
  4. {
  5.     var $code = "";
  6.    
  7.     function cargarPaises()
  8.     {
  9.         $consulta = parent::consulta("SELECT Name,Code FROM tb_provincias ORDER BY Name ASC");
  10.         $num_total_registros = parent::num_rows($consulta);
  11.         if($num_total_registros>0)
  12.         {
  13.             $paises = array();
  14.             while($pais = parent::fetch_assoc($consulta))
  15.             {
  16.                 $code = $pais["Code"];
  17.                 $name = $pais["Name"];             
  18.                 $paises[$code]=$name;
  19.             }
  20.             return $paises;
  21.         }
  22.         else
  23.         {
  24.             return false;
  25.         }
  26.     }
  27.     function cargarEstados()
  28.     {
  29.         $consulta = parent::consulta("SELECT Name FROM tb_poblaciones WHERE Provincia = '".$this->code."'");
  30.         $num_total_registros = parent::num_rows($consulta);
  31.         if($num_total_registros>0)
  32.         {
  33.             $estados = array();
  34.             while($estado = parent::fetch_assoc($consulta))
  35.             {
  36.                 $name = $estado["Name"];               
  37.                 $estados[$name]=$name;
  38.             }
  39.             return $estados;
  40.         }
  41.         else
  42.         {
  43.             return false;
  44.         }
  45.     }
  46.        
  47.     function cargarCiudades()
  48.     {
  49.         $consulta = parent::consulta("SELECT Name FROM tb_zonas WHERE Province = '".$this->code."'");
  50.         $num_total_registros = parent::num_rows($consulta);
  51.         if($num_total_registros>0)
  52.         {
  53.             $ciudades = array();
  54.             while($ciudad = parent::fetch_assoc($consulta))
  55.             {
  56.                 $name = $ciudad["Name"];               
  57.                 $ciudades[$name]=$name;
  58.             }
  59.             return $ciudades;
  60.         }
  61.         else
  62.         {
  63.             return false;
  64.         }
  65.     }      
  66. }
  67. ?>

CLASES/class.mysql.php
Código PHP:
Ver original
  1. <?php
  2. class MySQL
  3. {
  4.   var $conexion;
  5.   function MySQL()
  6.   {
  7.     if(!isset($this->conexion))
  8.     {
  9.         $this->conexion = (mysql_connect("localhost","XXX","XXX")) or die(mysql_error());
  10.         mysql_select_db("inmobiliaria",$this->conexion) or die(mysql_error());
  11.     }
  12.     mysql_query("SET NAMES 'utf8'");// esto se ha añadido para que salgan bien los acentos en los selects
  13.   }
  14.  
  15.  function consulta($consulta)
  16.  {
  17.     $resultado = mysql_query($consulta,$this->conexion);
  18.     if(!$resultado)
  19.     {
  20.         echo 'MySQL Error: ' . mysql_error();
  21.         exit;
  22.     }
  23.     return $resultado;
  24.   }
  25.  
  26.  function fetch_array($consulta)
  27.  {
  28.     return mysql_fetch_array($consulta);
  29.  }
  30.  
  31.  function num_rows($consulta)
  32.  {
  33.      return mysql_num_rows($consulta);
  34.  }
  35.  
  36.  function fetch_row($consulta)
  37.  {
  38.      return mysql_fetch_row($consulta);
  39.  }
  40.  function fetch_assoc($consulta)
  41.  {
  42.      return mysql_fetch_assoc($consulta);
  43.  }
  44.  
  45. }
  46.  
  47. ?>
Espero me podáis ayudar muchas gracias
__________________
¿Hay algo mas hermoso que ayudar.?
  #2 (permalink)  
Antiguo 29/01/2015, 03:08
 
Fecha de Ingreso: enero-2011
Ubicación: España
Mensajes: 222
Antigüedad: 13 años, 3 meses
Puntos: 7
Respuesta: Selects Dependientes

Hola.

¿Nadie sabe como lo puedo arreglar?.
__________________
¿Hay algo mas hermoso que ayudar.?

Etiquetas: dependientes, funcion, html, input, js, php, select, selects
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




La zona horaria es GMT -6. Ahora son las 02:07.