Este ejemplo de combobox de 3 niveles se puede poner en practica en diferentes áreas, en este ejemplo lo usare para países, estados y ciudades.

Ya hace tiempo algunos amigos me habían solicitado este ejemplo pero no pude realizarlo por estar trabajando en otras cuestiones.

Pues bueno el ejemplo consiste en 3 select o combobox pero estos están relacionados de manera que los datos del segundo select dependen del primero y los datos del tercero dependen del segundo, un poco confuso pero en la practica se entiende asi:

Primero seleccionamos un país(combo 1) y se despliegan todos los “estados o provincias” que pertenecen al país seleccionados en el combo 2, y después de seleccionar un estado o provincia del combo 2, se muestran todas las ciudades que pertenecen al estado seleccionado.

Aquí les dejo una imagen de la vista principal:

Para cargar los datos en los combobox de estado y ciudad usamos jquery y ajax.

También usamos Mysql y el paquete de descarga encontraran una vista para agregar países, estados y ciudades de forma fácil.

Descripción

A continuación les explico los archivos con los que se encontraran después de descargar el archivo combobox3.zip:

• instalation.txt: Instrucciones de instalación.
• schema.sql: Archivo que contiene las tablas de la base de datos para que el sistema funcione.
• db.php: Archivo de conexión a la base de datos
• index.php: Archivo inicial donde se pueden ver y manejar con los 3 combobox pero antes hay que agregar valores en el archivo new.php
• new.php: El archivo sirve para agregar a la base de datos países, estados y ciudades que luego son usados por index.php
• add.php: Maneja las peticiones POST y tiene las consultas sql para agregar países, estados, ciudades y combos.
• get_states.php: Recibe un id de pais y devuelve todos los estados en opciones “option” para el combobox de estados.
• get_cities.php: Recibe un id de estado y devuelve todas las ciudades en opciones “option” para el combobox de ciudades.

Descargar

Link: http://picocurl.com/11227357/combobox3

Gracias compartir y por usar el acortador de links y ayudarnos a crecer.

Finalizando

No me queda mas que desearles suerte a todos en sus proyectos y espero que ustedes apoyen los míos ;).

No se olviden de suscribirse al blog para recibir noticias cada vez que publique un nuevo articulo.

Tampoco se olviden de apoyarnos enviando donaciones que apoyan el crecimiento de nuestro proyecto.