elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Guía rápida para descarga de herramientas gratuitas de seguridad y desinfección


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web
| | |-+  PHP (Moderador: #!drvy)
| | | |-+  [APORTE] Select Totalmente Dinamico
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: [APORTE] Select Totalmente Dinamico  (Leído 3,469 veces)
AFelipeTrujillo

Desconectado Desconectado

Mensajes: 160



Ver Perfil WWW
[APORTE] Select Totalmente Dinamico
« en: 16 Febrero 2010, 22:08 pm »

Les dejo el código de un select totalmente dinámico y con persistencia... salu2

ajax.sql

Código
  1. -- phpMyAdmin SQL Dump
  2. -- version 3.1.1
  3. -- http://www.phpmyadmin.net
  4. --
  5. -- Servidor: localhost
  6. -- Tiempo de generación: 11-01-2010 a las 19:38:51
  7. -- Versión del servidor: 5.1.38
  8. -- Versión de PHP: 5.2.8
  9.  
  10. SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
  11.  
  12. --
  13. -- Base de datos: `ajax`
  14. --
  15.  
  16. -- --------------------------------------------------------
  17.  
  18. --
  19. -- Estructura de tabla para la tabla `ciudades`
  20. --
  21.  
  22. CREATE TABLE IF NOT EXISTS `ciudades` (
  23.  `id` INT(11) NOT NULL AUTO_INCREMENT,
  24.  `id_mun` INT(11) NOT NULL,
  25.  `ciu_nombre` VARCHAR(20) NOT NULL,
  26.  PRIMARY KEY (`id`)
  27. ) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=15 ;
  28.  
  29. --
  30. -- Volcar la base de datos para la tabla `ciudades`
  31. --
  32.  
  33. INSERT INTO `ciudades` (`id`, `id_mun`, `ciu_nombre`) VALUES
  34. (1, 1, 'Bogota'),
  35. (2, 1, 'Girardot'),
  36. (3, 1, 'Fusafasuga'),
  37. (4, 1, 'Sopo'),
  38. (5, 1, 'Chia'),
  39. (6, 1, 'Tocaima'),
  40. (7, 2, 'Medellin'),
  41. (8, 2, 'Envigado'),
  42. (9, 2, 'Itagui'),
  43. (10, 2, 'Jardin'),
  44. (11, 3, 'Neiva'),
  45. (12, 3, 'Pitalito'),
  46. (13, 3, 'Rivera'),
  47. (14, 3, 'Timana');
  48.  
  49. -- --------------------------------------------------------
  50.  
  51. --
  52. -- Estructura de tabla para la tabla `municipios`
  53. --
  54.  
  55. CREATE TABLE IF NOT EXISTS `municipios` (
  56.  `mun_nombre` VARCHAR(20) NOT NULL,
  57.  `id` INT(11) NOT NULL AUTO_INCREMENT,
  58.  PRIMARY KEY (`id`)
  59. ) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;
  60.  
  61. --
  62. -- Volcar la base de datos para la tabla `municipios`
  63. --
  64.  
  65. INSERT INTO `municipios` (`mun_nombre`, `id`) VALUES
  66. ('Cundinamarca', 1),
  67. ('Antioquia', 2),
  68. ('Huila', 3);
  69.  

conexion.php

Código
  1. <?php
  2. #  AUTHOR: 4ng3r
  3. #  Aplicacion: Select Totalmente Dinamico    
  4. #  URL: http://angercode.wordpress.com
  5. #  URL: http://foro.project-ric.org
  6. #  Conexion a la Base de datos
  7.  
  8. function conectar(){
  9.    if(mysql_connect("127.0.0.1","root","")){
  10.        return mysql_select_db("ajax");    
  11.    }else{
  12.        return FALSE;    
  13.    }
  14. }
  15.  
  16. function desconectar(){
  17.    mysql_close();
  18. }
  19.  
  20. function consulta_Mun($val){
  21.    $query = sprintf("SELECT %s FROM municipios",mysql_real_escape_string($val));
  22.    $sql=mysql_query($query);
  23.    $i=0;
  24.    $valores = Array();
  25.    while ($row = mysql_fetch_assoc($sql)){
  26.        $valores[$i]=$row["$val"];
  27.        $i++;
  28.    }
  29.    return $valores;
  30. }
  31.  
  32. ?>
  33.  

interfaz.php

Código
  1. <?php
  2. #  AUTHOR: 4ng3r
  3. #  Aplicacion: Select Totalmente Dinamico    
  4. #  URL: http://angercode.wordpress.com
  5. #  URL: http://foro.project-ric.org
  6. #  Interfaz
  7.  
  8. include_once("conexion.php");
  9. if(conectar()){
  10.        function cargarMunicipios(){
  11.        $nom_M = consulta_Mun("mun_nombre");
  12.        $id_M = consulta_Mun("id");
  13.        echo "<select name='municipios' id ='municipios' onChange='cargador(this.id)'>";
  14.        echo "<option value='0'>Elija un Municipio</option>";
  15.        for($i=0;$i<sizeof($nom_M);$i++){
  16.            echo "<option value=".$id_M[$i].">".$nom_M[$i]."</option>";    
  17.        }
  18.        echo "</select>";
  19.    }
  20.  
  21. ?>
  22.  
  23. <html>
  24.  
  25.    <head>
  26.        <script src="script.js"></script>
  27.    </head>
  28.  
  29.    <body>
  30.        <div id="independiente">
  31.         <?=cargarMunicipios()?>
  32.        </div>
  33.        <br>
  34.        <div id="dependiente">
  35.            <select id="ciudades" name="ciudades" disabled="disable">
  36.                <option value="0">Elija una Ciudad</option>
  37.            </select>
  38.        </div>
  39.        <br><br>
  40.        <div id="cargando"></div>                  
  41.            <?php    
  42. } // END IF
  43.            ?>
  44.  
  45.  
  46.        </select>    
  47.    </body>
  48.  
  49. </html>
  50.  

script.js

Código
  1. //  AUTHOR: 4ng3r
  2. //     Aplicacion: Select Totalmente Dinamico
  3. //  URL: http://angercode.wordpress.com
  4. //  URL: http://foro.project-ric.org
  5. //  Cargador de Contenido
  6.  
  7. function contenidoXML(){
  8.    return XMLHttpRequest();
  9. }
  10.  
  11. // Declaro los compoenentes selects que va a utilizar mi aplicacion
  12. // y debe coconrdar con el ID que le pusimos en el HTML
  13.  
  14. var selectsHTML = new Array();
  15. selectsHTML[0]="municipios";
  16. selectsHTML[1]="ciudades";
  17.  
  18. function cargador(idSelect){
  19.    var selectIndependiente=document.getElementById(idSelect);
  20.    // Seleccionamos el Select que depende al select que le corresponda el id=idSelect
  21.    var selectDependiente= buscarSelect(selectsHTML,idSelect)+1;
  22.    var option = selectIndependiente.options[selectIndependiente.selectedIndex].value;
  23.    // Validamos si el usuario elijio la primero opcion, es decir, Elija un Municipio
  24.    // y envio un advertencia
  25.    if(option==0){
  26.        // obtengo el Elemento
  27.        selectD = document.getElementById(selectsHTML[selectDependiente]);
  28.        // Borro los elementos que hay en el
  29.        selectD.length=0;
  30.  
  31.        var mensaje = document.createElement("option");
  32.        mensaje.value=0;
  33.        mensaje.innerHTML="Debe elegir un Municipio !!!";
  34.        // Incrusto el nuevo nodo
  35.        selectD.appendChild(mensaje)
  36.        selectD.disabled=true;
  37.    }else{
  38.        // Obtenemos el id del select que debemos cargar
  39.        var idSelecteD = selectsHTML[selectDependiente];
  40.        var selectD = document.getElementById(idSelecteD);
  41.        var ajax = contenidoXML();
  42.        ajax.open("GET","respuesta.php?option="+option,true);
  43.        ajax.onreadystatechange=function(){
  44.            if (ajax.readyState==1){
  45.                document.getElementById("cargando").innerHTML="<img src='cargando.gif'>"
  46.            }
  47.  
  48.            if(ajax.readyState==4){
  49.                selectD.parentNode.innerHTML=ajax.responseText;
  50.                document.getElementById("cargando").innerHTML="Consulta Satisfactoria"
  51.            }
  52.        }
  53.        ajax.send(null);
  54.    }
  55. }
  56.  
  57. // Funcion para encontrar si el selec existe
  58. function buscarSelect(arreglo , id){
  59.    var x=0;
  60.    while (arreglo[x]){
  61.        if(arreglo[x]==id){
  62.            return x;
  63.        }
  64.        x++;
  65.    }
  66.    return null;
  67. }
  68.  

Respuesta.php

Código
  1. <?php
  2. #  AUTHOR: 4ng3r
  3. #  Aplicacion: Select Totalmente Dinamico
  4. #  URL: http://angercode.wordpress.com
  5. #  URL: http://foro.project-ric.org
  6. #  Respuesta
  7.  
  8. include('conexion.php');
  9. conectar();
  10. $option = $_GET['option'];
  11. $query = "SELECT * FROM ciudades WHERE id_mun=".$option;
  12. $sql=mysql_query($query);
  13. echo "<select name = 'ciudades' id='ciudades'>";
  14. echo "<option>Elija un Ciudad</option>";
  15. while($row = mysql_fetch_assoc($sql)){
  16.    echo "<option value='".$row['id']."'>".$row['ciu_nombre']."</option>";
  17. }
  18. echo "</select>";
  19. ?>
  20.  

DESCARGAR

RESULTADO


En línea

Nakp
casi es
Ex-Staff
*
Desconectado Desconectado

Mensajes: 6.336

he vuelto :)


Ver Perfil WWW
Re: [APORTE] Select Totalmente Dinamico
« Respuesta #1 en: 16 Febrero 2010, 22:28 pm »

grandioso aporte... pero no funciona en ie XD, es cuestion de hacerle un arreglo menor a tu funcion contenidoXML() :P

lo muevo a php


En línea

Ojo por ojo, y el mundo acabará ciego.
AFelipeTrujillo

Desconectado Desconectado

Mensajes: 160



Ver Perfil WWW
Re: [APORTE] Select Totalmente Dinamico
« Respuesta #2 en: 16 Febrero 2010, 22:40 pm »

jeje gracias hombre nunca lo habia probado en IE lo odio pero estare en la mira de arreglarlo... gracas
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
select dinamico en cargado con Jquery
Desarrollo Web
01munrra 0 2,081 Último mensaje 29 Agosto 2012, 00:51 am
por 01munrra
como crear tabla dinamica con un select dinamico php
PHP
include (); 3 11,828 Último mensaje 21 Septiembre 2012, 03:05 am
por include ();
select dinamico en jquery
Desarrollo Web
kakashi20 2 2,711 Último mensaje 16 Junio 2013, 14:37 pm
por #!drvy
problema al iterar consulta para llenar select dinamico
PHP
d91 2 2,750 Último mensaje 27 Septiembre 2016, 15:08 pm
por d91
Este es mi aporte. pagina totalmente gratis para liberar algunos celulares
Dispositivos Móviles (PDA's, Smartphones, Tablets)
anzins 0 2,476 Último mensaje 7 Octubre 2017, 17:18 pm
por anzins
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines