combox dependientes php mysql jquery

a_gomez · #1 (**permalink**) 15/05/2012, 11:13

hola amigos como estan el problema uqe tengo es el siguiente tengo una seri de combox o selects dependientes y e intentado controlarlos por medio de jquery basandome en un codigo que encontre en esta pagina http://jjeb.wordpress.com/.

He modificado la base de datos y acoplado el codigo a mi necesidad pero no me funciona. :(

el orden de mi comobox es ciudad -> comuna -> barrio

me sale la lista de ciudad ha la hora de seleccionar comuna no me carga las comunas.
esta es mi pagina com_dependientes.php

Código PHP:

Ver original<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title></title>
 </head>
<?
 include("mysql_inc.php");
 $mysql = new MySql_Class;
 $mysql->user="root";
 $mysql->password="toor";
 $mysql->db="combox";
 $mysql->server="localhost";
 $mysql->conection();
 ?>
 
 <script src="js/jquery.js"></script>
 <script>
 $(document).ready(function(){
 $("select").change(function(){
 // Vector para saber cuál es el siguiente combo a llenar
 var combos = new Array();
 combos['ciudad'] = "comuna";
 combos['comuna'] = "barrio";
 // Tomo el nombre del combo al que se le a dado el clic por ejemplo: ciudad
 posicion = $(this).attr("name");
 // Tomo el valor de la opción seleccionada
 valor = $(this).val()
 // Evaluó  que si es ciudad y el valor es 0, vacié los combos de comuna y barrio
 if(posicion == 'ciudad' && valor==0){
 $("#comuna").html('    <option value="0" selected="selected">---- SELECCIONE LA COMUNA ----</option>')
 $("#barrio").html('    <option value="0" selected="selected">----- SELECCIONE LA BARRIO -----</option>')
 }else{
 /* En caso contrario agregado el letreo de cargando a el combo siguiente
 Ejemplo: Si seleccione ciudad voy a tener que el siguiente según mi vector combos es: comuna  por qué  combos [ciudad] = comuna
 */
 $("#"+combos[posicion]).html('<option selected="selected" value="0">Cargando...</option>')
 /* Verificamos si el valor seleccionado es diferente de 0 y si el combo es diferente de barrio, esto porque no tendría caso hacer la consulta a barrio porque no existe un combo dependiente de este */
 if(valor!="0" || posicion !='barrio'){
 // Llamamos a pagina de combos.php donde ejecuto las consultas para llenar los combos
 $.post("combos.php",{
 combo:$(this).attr("name"), // Nombre del combo
 id:$(this).val() // Valor seleccionado
 },function(data){
 $("#"+combos[posicion]).html(data);    //Tomo el resultado de pagina e inserto los datos en el combo indicado
 })
 }
 }
 })
 })
 </script>
 <body>
 <form id="form1" name="form1">
 <div>
 <select name="ciudad" id="ciudad">
 <option selected="selected" value="0">----- SELECCIONE LA CIUDAD -----</option>
 <?php
 
 $rs = mysql_query("SELECT * FROM ciudad order by ciudad");
            for($k=0;$k < mysql_num_rows($rs); $k++){
                $fila = mysql_fetch_assoc($rs);
                echo '<option value="'.$fila["idciudad"].'">'.htmlentities($fila["ciudad"]).'</option>';
            } 
 ?>
 
 
 </select>
 
 <select id="comuna" name="comuna">
 <option value="0" selected="selected">---- SELECCIONE LA COMUNA ----</option>
 </select>
 
 <select id="barrio" name="barrio">
 <option value="0" selected="selected">----- SELECCIONE LA BARRIO -----</option>
 </select>
 
 </form>
 </body>
 </html>

y esta es la pagina combos.php

Código PHP:

Ver original<?
 
 include("mysql_inc.php");
 $mysql = new MySql_Class;
 $mysql->user="root";
 $mysql->password="toor";
 $mysql->db="combox";
 $mysql->server="localhost";
 $mysql->conection();
 
 
 $idcombo = $_POST["id"];
 $action =$_POST["combo"];
 
 switch($action){
 case "ciudad":{
 
  $rs = mysql_query("SELECT idcomuna,comuna FROM comuna WHERE ciudad = $idcombo order by comuna ASC");
            for($k=0;$k < mysql_num_rows($rs); $k++){
                $fila = mysql_fetch_assoc($rs);
                echo '<option value="'.$fila["idcomuna"].'">'.htmlentities($fila["comuna"]).'</option>';
            } 
 break;
 }
 case "comuna":{
 
  $rs = mysql_query("SELECT idbarrio,barrio FROM barrio WHERE comuna= $idcombo order by barrio ASC");
            for($k=0;$k < mysql_num_rows($rs); $k++){
                $fila = mysql_fetch_assoc($rs);
                 echo '<option value="'.$rs["idbarrio"].'">'.htmlentities($rs["barrio"]).'</option>';
            } 
 break;
 }
 }
 ?>

gracias por su colaboracion y cualquier comentario es de ayuda.

ocp001a · #2 (**permalink**) 15/05/2012, 11:19

No suelo usar jquery por lo que no te podría ayudar mucho, pero hace unos días coloqué un ejemplo con xajax, si no te molesta usar esta librería, puede que te sea de ayuda

Swab · #3 (**permalink**) 15/05/2012, 11:55

a_gomez mira este ejemplo, es ajax, pero funciona a la perfección...

http://www.formatoweb.com.ar/ajax/se..._3_niveles.php

Suerte

Swab · #4 (**permalink**) 15/05/2012, 11:58

Cita:

Iniciado por Swab

a_gomez mira este ejemplo, es ajax, pero funciona a la perfección...

http://www.formatoweb.com.ar/ajax/se...pendientes.php

http://www.formatoweb.com.ar/ajax/se..._3_niveles.php

Suerte

a_gomez · #5 (**permalink**) 15/05/2012, 12:08

Cita:

Iniciado por ocp001a

No suelo usar jquery por lo que no te podría ayudar mucho, pero hace unos días coloqué un ejemplo con xajax, si no te molesta usar esta librería, puede que te sea de ayuda

gracias me ha servido de ayuda tu ejemplo..

a_gomez · #6 (**permalink**) 15/05/2012, 12:09

Swab

gracias por tu aporte es importante para mi y para futuras personas que consulten este foro.