Combos dependientes con jQuery, Ajax y PHP
Seguramente has visto en algunas páginas Webs los combos dependientes (selectores) que al seleccionar una opción en el primer combo, te aparecen las opciones relacionadas con este en un segundo combo.
En muchas ocasiones nos vemos en la necesidad de usar estos combos o selectores que se llenen según lo que elegimos en otro combo, como por ejemplo, si tenemos un selector de países y queremos que cuando se elija un país, en otro selector aparezcan las ciudades o estados del país elegido.
Es posible que hayas visto muchos tutoriales y ejemplos sobre esto pero estos son muy difíciles de modificar para conseguir personalizarlo al máximo.
En este artículo vamos a explicar una forma muy sencilla de conseguirlo y que puede servir para cualquier posibilidad y además es muy sencillo de entender y modificar.
Vamos a explicar un ejemplo en el cual vamos a tener marcas de coches anidando con algunas de sus modelos.
En el cuerpo de la página o dentro de la etiqueta <body> creamos el formulario con los 2 selectores de la siguiente forma:
<form class="row" action="" method="post">
<div class="form-group col-lg-3">
<label for="marca">Marca</label>
<select name="marca" id="marca" class="form-control">
<option value="1">Renault</option>
<option value="2">Seat</option>
<option value="3">Peugeot</option>
</select>
</div>
<div class="form-group col-lg-3">
<label for="modelo">Modelo</label>
<select name="modelo" id="modelo" class="form-control">
<option value="1">4</option>
<option value="2">5</option>
<option value="3">7</option>
<option value="4">21</option>
<option value="5">Scennic</option>
<option value="6">Traffic</option>
</select>
</div>
</form>
Tenemos un selector inicial donde el usuario puede elegir la marca y un segundo selector donde el usuario puede elegir el modelo.
En la cabecera de la página o dentro de la etiqueta <head> se debe incluir la librería jQuery y el script de la llamada al evento:
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script language="javascript">
$(document).ready(function(){
$("#marca").on('change', function () {
$("#marca option:selected").each(function () {
elegido=$(this).val();
$.post("modelos.php", { elegido: elegido }, function(data){
$("#modelo").html(data);
});
});
});
});
</script>
El código de la llamada al evento se encarga de esperar a que el selector con identificador «marca» sea cambiado para rellenar el segundo selector con los modelos mediante una llamada Ajax.
En este archivo «modelos.php» tan solo hacemos lo siguiente:
<?php
$html = "";
if ($_POST["elegido"]==1) {
$html = '
<option value="1">4</option>
<option value="2">5</option>
<option value="3">7</option>
<option value="4">21</option>
<option value="5">Scennic</option>
<option value="6">Traffic</option>
';
}
if ($_POST["elegido"]==2) {
$html = '
<option value="1">Ibiza</option>
<option value="2">Toledo</option>
<option value="3">Cordoba</option>
<option value="4">Arosa</option>
';
}
if ($_POST["elegido"]==3) {
$html = '
<option value="1">106</option>
<option value="2">206</option>
<option value="3">306</option>
';
}
echo $html;
?>
Según la marca elegida retornará unas opciones u otras. Las opciones que retorna el archivo «modelos.php» se establecen en el selector con identificador «modelo».
La clave del asunto es la llamada mediante AJAX al archivo «modelos.php» que tiene una lista de las opciones de las diferentes marcas y se retorna aquella lista de opciones que represente o sean de la marca escogida.
Como vemos tenemos 2 combos abiertos o a la vista por defecto. Al cambiar la marca, dinámicamente cambian los modelos gracias al código jQuery, Ajax y al archivo «modelos.php» que se encarga de retornar la lista de opciones que toca.
Ver el ejemplo de las marcas y modelos
Muchas gracias por el tutorial, pero no logro me muestre los datos de mi 2do campo.
Te comento:
Mi base de datos consta de 5 campos:
Id_asentamiento
municipio
localidad
asentamiento
num_asentamiento.
Al seleccionar municipio, necesito me muestre los asentamientos de esa localidad. Pero no lo logro…
Me podrías ayudar….
Gracias de antemano
Hola,
Si todavía tienes problemas para hacer funcionar este tutorial, envíanos un ticket a:
https://www.jamodules.com/es/soporte
Con todos los detalles para que lo estudiemos y te brindemos una solución.
Saludos
Buen ejemplo amigo, una consulta tienes un ejemplo para editar y que me cargue los datos guardados en la base de datos? tengo un problema para mostrar lo que trae el segundo select desde la base de datos, no logro que lo muestre, Saludos
Hola,
Quizá te pueda servir este antiguo tutorial -> https://www.jose-aguilar.com/blog/modificar-registros-en-linea-con-jquery-ajax-php/
Saludos
Muchísimas gracias por compartir tus conocimientos. Me ha funcionado a la perfección.
Saludos josé, excelente tuto.
Hace algún tiempo lo usé para adaptarlo a una búsqueda en base de datos, de estado, municipios y parroquias y funciona perfecto.
Mi pregunta es la siguiente, ya que leí que también eres experto en wordpress y la pregunta va para esta misma acción en wordpress.
Tengo un formulario hecho en elementor pro, cree los tres select que necesito en custom html, y obtengo mis datos de la base de datos perfectamente en cada uno, hasta aqui todo bien…
el problema: que no logro que los select cambien al cambiar el primero y luego el segungo…
use el metodo de ajax, logro recibir el callback de respuesta de la id del primer select, que uso para identificar los municipios del estado seleccionado… pero al estar dentro de un callback esta fuera del shortcode del segundo select, y no puedo sacar del callback la variable que necesito en el segundo shortcode, se me entiende?…
en resumen está la variable en funciones diferentes y no logro sacarlo de una para usarla en la otra función del select…. de todas formas, si tienes un tutorial para hacer esto mismo en wordpress me gustaria verlo… agradecido y exitos josé
Hola,
Lamento decir que no tengo un tutorial para WordPress con este contenido.
Intenta buscar otra solución que no sea con shortcodes. Quizá debes tocar el js de la plantilla y hacer una llamada ajax hacia algún archivo php que pueda hacer de controlador.
Saludos
Hola José, espero estés bien.
La cuestión es que estoy haciendo un sistema, donde le coloco un SELECT DEPENDIENTE. En mi caso; para identificar Distrito, ciudades de esos distritos y sectores de esas ciudades, estoy usando una plantilla que conseguí en internet, y todo funciona bien… La disyuntiva es que, esos datos los tengo para que se me registren en otra tabla, sin embargo, se registran pero se registran son los ID, y no los nombres de Distrito, etc. Quiero que lo que se registre en esa tabla sea los nombres, pero no sé cómo hacerlo:(
Hola,
Para registrar los nombres en la tabla en primer lugar tendrás que preparar esa tabla para que pueda guardar los nombres. Debes crear o modificar el campo a tipo cadena. Después de eso, en los value de los options de los selectores deberás añadir ese nombre.
Saludos
Hola Jose Aguilar probe tu modelo de select asociativo y trabaja de manera perfecta pero ahora tengo una duda, quiero hacer esto a 3 niveles primer selecr nombre de doctos se activa el segundo select donde vere el los dias disponibles de cita y al seleccionar el dia se activaria un tercer select con los horarios disponibles ese dia, podrias echarme una mano porfavor ?
Hola,
Envía un ticket al centro de soporte técnico con todos los detalles para que lo podamos estudiar.
https://www.jose-aguilar.com/modulos-prestashop/es/soporte
Saludos
Buen día José Aguilar
Hace un par de semanas atrás implemente lo del combo selector anidado en dos niveles, replicando parte de tu código lo que me fue bastante útil, esto lo cargue dentro de un modal, y mostraba la información en el modal de cada botón que me mostraba un datatable, con el evento data enviaba los datos al modal cargados desde el botón y todo funciono bien, pero me solicitaron que por cada botón se cargara un modal (propio con id) agregando el numero de petición desde el botón, y tuve que cambiar la manera de mostrar la información, agregue la función para recargar los selects de acuerdo a la forma en que lo explicas, mi problema es que en ocasiones carga la función de los selects y en otras no, y es un evento al azar, de 5 carga 1, o 2, o 3, pero nunca carga los 5, si tengo 95 modales, casi la mitad pueden no trabajar, como puedo resolver que la carga de la función del combo selector sea efectiva para todos los modales.
Hola
Como le haria para que se replique de manera dinamica, te explico:
Tengo un select general que afecta a varios select (esa parte me funciona bien)
Pero si agrego dinamicamente otro div (que contiene un input y un select) este ultimo ya no le actualiza el select solo afecta al primer select, debo mencionar que este nuevo select tiene el mismo que uno que ya existe lo declaro como un array (para el input si me funciona) pero para el select no me funciona si lo declaro como array, debo dejarlo como variable ‘simple’ pero solo me afecta al primer select con ese id, ya que el usuario puede crar tantos input como desee y obtengo su valor (ya que esta en un arreglo) para la BD.
Hola,
Para que alguien pueda ayudarte, lo recomendable es que nos facilites el enlace donde esté tu código fuente. De esta forma, se puede analizar más fácilmenete.
Saludos
amigo, y como seria con 3 combos
Hola,
De la misma forma pero anidando otra llamada Ajax para cargar el contenido en el tercer selector.
Saludos
hola!
si tengo un select con dos value, es decir nombre como hago para que funcione tu codigo?
Hola,
Debería funcionar de la misma forma. ¿Puedes enviar la url donde se ejecuta tu código para verlo?
Saludos
estimado necesito ponerme en contacto via email , mi email es carlosdeoliv@gmail.com es sobre un proyecto web. gracias
Hola,
Gracias por tu mensaje.
Si necesitas que revisemos tu necesidad para valorarlo lo ideal es que nos envíes un ticket al centro de soporte técnico situado en:
https://www.jose-aguilar.com/modulos-prestashop/es/soporte
Saludos
Hola, gracias por el aporte, te consulto: en caso que la validación da error y vuelve al formulario, se pierden los valores cargados por ajax, es decir en el ejemplo de autos, el select de modelos que depende de la marca no mantiene solo los modelos de dicha marca como puedo mantener dicha información.
Desde ya muchas gracias.
Buenas Jose tengo un problema a la hora de guardar en base de datos , he utilizado tu código para incluirlo dentro de un formulario , pero a la hora de guardar todo el formulario en la base de datos me guarda el ID no el nombre seleccionado .
ya no se ni donde me mirar si me pudieras hecha una mano .
Gracias de antemano y un saludo
Hola,
Gracias por tu mensaje.
No acabo de entender el problema que tienes. Si necesitas ayuda extra a lo que hay en el blog quizás te puede interesar enviar tu petición completa a nuestro centro de soporte técnico situado en:
https://www.jose-aguilar.com/modulos-prestashop/es/soporte
Allí podremos estudiar tu petición en detalle para darte una respuesta.
Saludos
Hola Buen Día,
Pregunta por que no carga en otro navegar, por ejemplo no me corre en Mozilla Firefox
Hola,
En Mozilla Firefox no debería haber ningún inconveniente. ¿Qué ejemplo no funciona?
Saludos
¡Excelente ejemplo!
¿cómo podría mandar en el segundo select la variable -marca- hacia el tercer select?
Es decir, para que el archivo colores.php pueda filtrar marca y modelo desde una BD?
De antemano gracias por tu ayuda y por compartir tu conocimiento.
Hola,
Según el ejemplo en funcionamiento el valor del selector marca está en:
elegido=$(this).val();
Saludos
al descargar el rar de combos dependiente, no funciona alguno sabe cual seria la razon?
Quizá debes rellenar los datos para conectar con tu base de datos y modificar las consultas según lo que necesites.
Este ejemplo esta bueno, sin embargo lo que yo necesito es insertar la informacion de los dos combobox en una Bd, pero al seleccionar el segundo se envia al formulario solo la informacion del segundo y no del primer combobox, como lo hago para enviar la informacion del primer combobox tambien?
tengo dudas con el codigo javascript.
Me podrias ayudar lo necesito urgente.
Hola,
En este caso tan solo tienes que agregar otra variable más para que el archivo php reciba también la información del primer combo. De la misma forma que se hace en el ejemplo con la variable «elegido».
Saludos
Me sirvio de mucho tu ejemplo, gracias amigo.
Muy útil este Post y bien explicado. Se agradece encontrar esta solución
[…] Este artículo va asociado a un artículo anterior en el que explicábamos como realizar combos dependientes con jQuery, Ajax y PHP. […]
Mil gracias José
Saludos como podría hacer para anidar mas de dos select, que me mostrara algo asi.
Ejemplo:
Marca, Modelo y Año.
Gracias
Muy bueno… Se puede mejorar pasando la variable que viene por post a la consulta SQL para que quede mas dinámico
Tengo una duda sobre el código, no he podido hacerlo funcionar, no se si es solo un archivo modelo.php o son varios archivos?
Gracias
Hola,
En el ejemplo en funcionamiento solo se usa un archivo modelos.php.
Saludos
Llevo días tratando de implementar algo igual y no lo he logrado porque son mínimos mis conocimientos, estoy creando una funcion con tu codigo dentro de funtion.php y creo un shortcode para ingresarlo en una pagina de wordpress, pero me desconfigura mi plantilla y no me muestra nada. Elimino las librerias de jquery y me muestra los select pero obviamente no cambian los valores al seleccionar las opciones. Me podrías orientar donde estaría mi error por favor y felicitaciones por tu trabajo.
Hola buenos días,
Para este tipo de ayudas que se salen de lo que hay en el blog debe enviarnos un ticket al centro de soporte técnico con todos los detalles de tu solicitud y allí le indicaremos como podemos proceder:
https://www.jose-aguilar.com/soporte/
Saludos
Hola Jose tengo una duda sobre como actuar en los elementos html.
Por ejemplo, me gustaría que según una determinada opción del primer desplegable el segundo desapareciera o apareciera otro elemento. Entiendo que debo controlarlo desde la función de ajax, pero no se como implementarlo.
Si me pudieras echar una mano?
Muchas gracias de antemano. El aporte me ha sido de gran ayuda.
Hola buenos días,
Para este tipo de ayudas que se salen de lo que hay en el blog debe enviarnos un ticket al centro de soporte y allí le indicaremos como podemos proceder:
https://www.jose-aguilar.com/soporte/
Saludos
Excelente aporte, poer dime algun ejemplo de como en vez de que se active la lista del combo2, aparzcan una tabla con un texto o un input text
Hola Jose mi duda es respecto a checkbox ¿se hace de la misma forma?
Me podrías asesorar en el procedimiento.
de ante mano muchas gracias por el aporte me a servido de mucho
Hola,
Me temo que para un checkbox no puedes emplear el envent «change». Deberás usar «click».
Saludos
Hola José Aguilar,
Gracias por compartir tu conocimiento con nosotros.
Me ha sido muy útil.
Saludos,
Hola queria decirte que me sirvió mucho tu ejemplo pero quisiera hacerte una consulta como hago para que aparezcan los resultados de la búsqueda en otra pagina html? se que tengo que poner un boton pero no se como vincularlo con la otra pagina.. muchas gracias por leerlo
buenas noches, necesito una consulta, yo realiza un combo de 3 niveles y funciona bien, pero como hago para cuando busque el registre me traiga los datos de los otros 2 combos? yo utilice el combo de <PHP <?php
$options="";
if ($_POST["elegido"]==Amazonas) {
$options= '
-Seleccione Un Municipio-
Alto Orinoco
Atabapo
‘;
echo $options;
?>, necesito que al buscar el registro me lleve todos los datos de los combos
hola
estoy usando tu código y no logro hacer el cambio automatico en los combos selecciono uno y el otro no hace nada me sale el error de indice indefino «elegido» de donde jalo los datos
Buenas noches, tengo una duda, necesito realizar un combo dependiente de Ciudades, Municipio y parroquias (Venezuela), pero no se que va dentro de los respectivos .php, eh modificado el script pero no me agarra.
Hola,
Si necesita ayuda, se lo podemos hacer nosotros pero necesitamos conocer todos los detalles de su implementación para ver como le podemos ayudar. Nos puede escribir a: blog@jose-aguilar.com
Saludos
Y como seria si yo lleno el primer combo desde base de datos y quiero que el segundo combo se llene según la opción del primer combo, en este caso reportes de autos, cada auto tiene un numero como la placa, luego se llena el reporte de fallas pero el auto puede tener varios reportes de fallas en un mismo mes o año o semana etc, así que filtro los resultados del combo con group by para que no me muestre los resultados repetidos es decir la misma placa del auto pero con diferentes reportes, y en base a esto (la placa elegida) que me llene en el combo siguiente las fechas de los reportes extraídas de la base de datos para visualizar el mas reciente o el mas viejo según se elija la placa y la fecha
hola buenos dias, muy bueno la explicacion, tengo una duda. eso lo puedo hacer desde un mismi documento o tengo que hacerlo por separado?
Hola buenos días,
Quizá si que es posible. Se tendría que probar. Tan solo cambiando la url del post ajax pero yo recomiendo hacerlo por separado.
Saludos
EXCELENTE EJEMPLOOOOOOOOOOOOO!!!!
Justo lo que necesitaba
Y hay una parte de tu codigo ‘jquery’ que no termino de entender porque gastas caracteres y es ‘option:selected’ de la linea 5.
El caso es que como se puede entender sin esa ‘opcion’ funciona igual de bien, pero seguro que tu la pusiste por algo que a mi se me escapa y por eso pregunto.
gracias
Hola, pues si te funciona quizá sobra. Ya está bien. Quizá hace unos años no funcionaba ya que este es un post antiguo. Saludos
Hola! Jose
Es de los pocos ejemplos que he podido entender, ya que apenas usas opciones que otros si usan en sus ejemplos.
Pero tengo una duda! ¿porque en mi caso SI VEO LOS ACENTOS?
Tenia entendido por otras webs que para que ajax pasara los acentos y otros caracteres raros necesitaba de JSON y tu creaste un codigo al que te atreviste a no usar tal estimada opcion y encima funciona! 😀
¿Que puedes contar de esto?
Hola,
Me parece que tan solo hay que guardar los archivos en utf-8 y tener el meta en la cabecera:
charset=utf-8
Saludso
este esta mejor http://riverajefer.blogspot.com/2013/04/combos-anidados-sin-recargar-con-jquery.html
sencillo y descargable
Excelente ejemplo, sencillo y funcional. Congratulations!!
Hola realice lo mismo que tu y no me funciona el archivo index lo deje en .php y en .hml y no me funciona el de modelos si lo deje en .php, que me puede estar faltando???
hola me fue super util el ejemplo y el codigo, tal cual esta org y planteado, quise adaptarlo a lo que ya tengo , tengo un arch clientes.php donde tengo formulario y en el los selects y me gustaria en el mismo tener el codigo php,quise hacer en el tomar la variable elegido con $_POST[«elegido»] intente reemplazar en el script modelos.php por clientes.php y tomarlo en el pero no pude hacerlo funcionar
Juan Pablo, este ejemplo te puede interesar
https://youtu.be/GYCMkX7Z9rg
hola, estoy intentando insertar en mi pagina hecha con wordpress 3 combos anidados pero no logro hacerlo y todo el mundo me dice que es complicado. Este codigo en wordpress donde tendria que pegarlo? me serviria en un widget de texto o tendria que pegarlo en el css del tema? me estoy volviendo loca y como podeis comprobar no entiendo mucho del tema… mil gracias de antemano
Hola buenas tardes,
No, ten en cuenta que este código utiliza php y ajax. En un widget no sería posible. Esto en un WordPress se podría implementar en los archivos php de la plantilla activa.
Saludos
Hola José lo hice andar a todo en una pagina metiendo el proceso.php antes del javascript lo que no puedo capturar es el id modelo al enviar los datos de los select desde un formulario el id marca lo envía correctamente saludos.
exelente aporte, se ajusta a lo que necesito y con la cantidad de codigo justo para ejecutar el proceso
hola una consulta yo tengo que insertar los datos de los combos pero cuando estan anidados como este ejemplo en vez de los datos en mi tabla mysql se insertan los valores.como puedo hacer para que me inserte los datos?
hola no acabamos de visualiar tu problema. si nos pasases una url para ver el problema quizás podamos ayudarte.
https://drive.google.com/open?id=0Byukz_faJY38UmFHcWtlSXVvVDg aqui esta mi codigo por favor ayudame
Muy buen ejemplo! después de tanto probar lo pude hacer andar!
mil gracias!
Buenas me gustaría saber si hay alguna opción de hacer una petición ajax sobre si misma es decir…tengo un formulario llamado formu.php y dentro de esté se encuentra el cod. html y la recepción de los datos y procesado del formulario… puedo poner en el ajax la llamada a formu.php?¿
Gracias
Buen día,
Gracias por su post, casi no encuentro algo que me sacara de apuros pero tengo una pregunta, cómo hago para que al tener los 3 datos seleccionados de los combobox los consulte en la bd y me traiga la información y me la muestre en forma de tabla dentro del html?. Gracias
Buen aporte
Hola, me gustaria hacer este ejemplo pero en una misma pagina, es posible hacer esto, vaya espero obtener respuesta pues este tema es del año pasado pero apenas ando comenzando en esta onda 😀 muchas gracias de ante mano y que excelentes aportaciones!! 😀
No se si se puede hacer. No lo veo claro. Es necesario tener ese archivo modelo.php para retornar los datos.
hola pudiste hacerlo en un mismo archivo?
Ya lo resolví, colocando en un archivo aparte, gracias!!! En realidad pase 2 días buscando esto… Gracias por el Aporte nuevamente!!!
Primero, felicitaciones por el orden del código y los buenos ejemplos!!!
No se que estoy haciendo mal (como debo de ordenar el código), me aparecen los formularios (hasta allí todo bien), pero son estáticos es decir que no cambian (como aquí «Ver el ejemplo de las marcas y modelos») y abajo este error:
Undefined index: elegido in C:\wamp\www\prueba\modelos.php on line 47
Hola Buenas Tardes una preguntota
Yo quiero hacer combos dependientes de 7 niveles que se jalen de la base de datos estoy usando cake php como se haría con ese framework
Por si a alguien le sirve:
http://www.jose-aguilar.com/blog/combos-dependientes-con-jquery-ajax-php-base-datos/
[…] Este artículo va asociado a un artículo anterior en el que explicábamos como realizar combos dependientes con jQuery, Ajax y PHP. […]
Muy bueno el aporte. gracias!
Muchas gracias excelelnte codigo
Aquí les dejo la solución a lo referente al vaciado desde una Base de Datos, espero les sirva:
if ($_POST[«elegido»]==1) {
$var1=»select A1FOLI from casas where STATUSMAS=’A’ order by A1FOLI»;
$casas= mysql_query ($var1);
$a = 1;
while ($fila1 = mysql_fetch_array($casas)){
echo «».$fila1[«A1FOLI»].»»;
$a++;
}
}
Muchas gracias al autor… hacer que las opciones se llenen desde una base de datos está fácil, si a alguien le sirve les dejo como sería utilizando el mismo ejemplo de los autos, junto con el script de mysql.
https://dl.dropboxusercontent.com/u/16501467/autos.tar.gz
Nuevamente gracias al autor, me sacaste de un apuro 😀
buenos dias podrias voler a subirlo ya que aparece que no esta seria de mucha ayuda
Hola, te agradecería me compartieras el código en caso de que hayas solucionado el ejercicio haciendo la consulta desde la base de datos, estoy estancado.
Gracias de antemano!
no lo he hecho pero estoy seguro que se puede hacer, me lo anotaré para complementar este tutorial
Par llenar el segundo combo desde una base de datos, ¿bastaría con hacer la consulta respecto a la opción elegida?
if ($_POST[«elegido»]==1) {
CONSULTA…..
//espero que sí :S
si, tendrás que conectarte antes en el mismo archivo ajax por eso
Hola . no podrias pasarme el JQUERY DE ESE EJERICIO . NECESITO GUIARME PORQUE NECESITO ALGO EXACTO PERO PARA LAS CIUDADES
El jquery del ejercicio es simplemente este:
super bien lo de tus combos dependientes , pero no me funciona creo que son los permisos, que tipo de permisos deben tener modelos.php ? y coches.html ?
saludos y gracias
felicidades
No puedo decirte cual es el error pero dudo mucho que sean de permisos. Mas bien, sin ver tu ejemplo diría que no estás cargando bien la librería jQuery. Mira bien eso.
Muchas gracias por el ejemplo! Me resuelve la vida porque yo necesito hacer post de tan solo dos valores (menu1 y menu2) y no estar consultando la base de datos por la infinidad de categorías que tengo en mi script. Gracias en verdad!
Hola buen aporte, tengo una pregunta, si quiero que esos resultados que me arroja, los quiero insertar en una bd, como podría hacer el proceso.
Saludos.
hola no puedes poner los archivos de ejemplo para descargarlos, necesito algo parecido tu ejemplo es muy bueno
gracias
Se agradece por su sencillez.
Gracias, a partir del ejemplo anterior ya he conseguido alimentar los tres combos a partir de tres tablas y hacer que dependa cada una de la anterior
Antes que nada, gracias por compartir tus conocimientos con todos nosotros. Quiero saber si me puedes despejar una duda y es que la verdad es que me estoy metiendo apenas al mundo de la creacion de una web y no entiendo donde debo de colocar el codigo php. Te agradeceria bastante el que me pudieras decir donde colocarlo.
Gracias por tu aporte, el ejemplo es muy claro y funciona perfectamente, pero ahora estoy intentando que los tres combos se carguen a partir de tablas mySQL, en función del valor seleccionado en el combo anterior y no consigo adaptar tu código. Tienes por ahi algún ejemplo o alguna pista.
Usted tiene ciertamente algunas de las opiniones y puntos de vista agradables. http://www.jose-aguilar.com ofrece una nueva mirada a la materia.
te felicito por tu explicacion es lo mejor que he encontrado en la web, pero tengo una pregunta como seria para combos deoendientes de tres niveles?
ejemplo: pais -> region -> ciudad
gracias por tu colaboracion de antemano ….
Hola buenas tardes, gracias por la felicitación.
Pues mira acabo de hacer un ejemplo con 3 niveles siguiendo el ejemplo de los coches.
Debes crear un archivo colores.php para llamarlo por post para incluir las opciones.
http://www.jose-aguilar.com/scripts/jquery/combos_dependientes/index_coches3niveles.html
espero que te sirva
hola amigo yo tengo un problema que veo que tu también lo que pasa es que cuando selecciono el primer combo el 3 y ultimo debería cambiar a (0) porque ese ultimo queda con los datos de la consulta pasada ejm.
>colombia
>santander
>bucaramanga
ahora hago otra consulta y cambio
>italia
>piamonte
>bucaramanga >>>>> X
entonces ese tercer combobox sigue con ese problema de no cambiar como se podría solucionar ..
gracias saludos
Serias tan amable me prestarias el codigo de colores.php
carlosmindfreak@gmail.com
– Hago el proceso y ejemplo en modelo escojo 4 y si me cambia los valores de la lista de colores PERO cuando escojo Otra marca y otro modelo no me lee los datos para colores. Gracias.
Hola,
Descargar todos los ejemplos de combos dependientes
Saludos
Hola Mara buenas tardes,
A simple vista veo un detalle. Yo al menos probaría de poner el foreach fuera de la variable y hacer echo solo de las opciones.
dentro del bucle ir concatenado las subcategorias asi:
Prueba y me comentas
Saludos,
Hola! muy bueno tu ejemplo!!!
Para combos de categorias y subcategorias, en donde estaría el código de modelos.php estoy intentando hacer algo dinámico, ya que las categorias y subcategorias pueden variar, hice algo asi:
<?php
$conn = new conection();
$rs = new RecordSet($conn);
$sql=\"SELECT `subcategoria`.`categoria`, `subcategoria`.`titulo`, `categoria`.`titulo`
FROM `categoria`, `subcategoria` WHERE `subcategoria`.`categoria` = `categoria`.`id`\";
$sub = $rs->get_object($sql);
$options=\"\";
if ($_POST[\"elegido\"]==1) {
$options= ?>\’
<?php
foreach($sub as $valor){ ?>
<option value=\"<?php echo $valor->id ?>\"><?php echo $valor->titulo ?></option>
<?php
}}?>
\’ <?php
}
echo $options;
?>
pero no logro levantar los datos correspondientes de la subcategoria, me podrías ayudar?
Desde ya muchas gracias!
Hola, yo uso aprox. Tu codigo con algunas modificaciones, pero no logro que me cargue los datos de un tercer select, todos hacen una consulta a la base de datos, funcionan dos, pero el tercero no =( alguien tiene idea?
$(document).ready(function(){
$(«#select4»).change(function(event){
var id = $(«#select4»).find(‘:selected’).val();
$(«#select5»).load(‘genera-tarjeta.php?id=’+id);
});
});
Hola! muy bueno tu ejemplo!!!
Para combos de categorias y subcategorias, en donde estaría el código de modelos.php estoy intentando hacer algo dinámico, ya que las categorias y subcategorias pueden variar, hice algo asi:
get_object($sql);
$options=»»;
if ($_POST[«elegido»]==1) {
$options= ?>’
<option value="id ?>»>titulo ?>
‘
pero no logro levantar los datos correspondientes de la subcategoria, me podrías ayudar?
Desde ya muchas gracias!