Combos anidados dependientes con jQuery

Buena idea. Eso sí, el código PHP tiene dos problemas de seguridad.

1) El uso del array $_REQUEST no está recomendado, ya que aglutina las variables que se reciben por POST, por GET y por la cookie, con lo que, por una parte, perdemos control (no sabemos de dónde ha venido una variable) y podemos sufrir re-escritura (si una variable GET se llama igual que una de POST… ¿cuál sobrevive?). Es por eso que se recomienda usar $_GET, $_POST o $_COOKIE/$_SESSION según corresponda.

2) Las queries SQL sin comillas son vulnerables a los peligrosos ataques de inyección SQL (he visto caer servidores por esa inocente falta de comillas), así que: $SQL = “SELECT * FROM Tablax WHERE Area=’” . mysql_escape_string($Area) . “‘”;

Por cierto, el código

for($i=0;$i<count($array_areas);$i++) {
echo “”.$array_areas[i].”" ;
}

Puede ser simplificando usando la construcción foreach:

foreach ($array_areas as $indice=>$valor) {
echo “$valor” ;
}

Esta forma es más fácil de leer, y se asemeja a las construcciones for…in.. de lenguajes como Python.

Hola amigos muchas gracias por los códigos, esta excelente.

Les escribo porque tengo una problema, soy totalmente novato en esto de las páginas web y asp y necesito anidar 3 combos Estado, Ciudad y Urbanizaciones. He tratado de generarlo desde el código que suministran acá, pero solo logro anidar Estado y Ciudad.

Podrían, por favor darme una mano, para anidar el tercer combo que dependa de la selección del segundo?.

Muchas gracias por su tiempo y pronta respuesta

Muchas gracias por tu pronta respuesta Walter.

Te comento que mi problema está en que no tengo idea de donde anexar el código. Realice una prueba colocándolo de esta manera, pero fue negativa

$(document).ready(function(){
$(“#select1″).change(function(){
$.post(“carga_select2.asp”,{ id:$(this).val() },function(data){$(“#select2″).html(data);})
});
$(“#select2″).change(function(){
$.post(“carga_select3.asp”,{ id:$(this).val() },function(data){$(“#select3″).html(data);})
});
})

————————————————————————–

Tambien intente hacer esto:

$(document).ready(function(){
$(“#select1″).change(function(){
$.post(“carga_select2.asp”,{ id:$(this).val() },function(data){$(“#select2″).html(data);})
$(“#select2″).change(function(){
$.post(“carga_select3.asp”,{ id:$(this).val() },function(data){$(“#select3″).html(data);})
});
})

————————————————————————–

Por favor podrias indicarme donde debo incluir el código de forma correcta para que los tres combos esten andidados?.

Gracias de antemano.

Les puede ayudar cargando de una BD los array se reduce mucho codigo por ejemplo el carga_select2 se reduce a esto.

<?php
$Area= $_REQUEST["id"];
//realizamos la consulta
include ‘conexion.php’;
conectar();
$consulta=mysql_query(“select A.id,A.name from service_sla,sla A where sla_id=A.id and A.valid_id=1 and service_id=”.$Area);
desconectar();
//el bucle para cargar las opciones
while($registro=mysql_fetch_row($consulta))
{
echo “”.$registro[1].”";
}
?>

Franky, muchas gracias por tu aporte. Analizare el código que compartes con nosotros para comenzar a entender PHP e intentar utilizarlo = )

Walter, te comento que coloque el código de java como me indicaste y repetí exactamente carga_select3 como se muestra a continuación, pero no funciona.

<%
on error resume next
dim adoConn2
dim adoRS2
set adoConn2 = Server.CreateObject(“ADODB.Connection”)
adoConn2.Open “Driver={mySQL ODBC 3.51 Driver}; Server=localhost; Port=3306; Option=0; Database=Prueba; Uid=Prueba; Pwd=Prueba;”
adoRS2.ActiveConnection = adoConn2

objConn2.ConnectionString = “DSN=myCONNECTION.dsn”
objConn2.Open

Area2= Request(“id”)
DIM SQL
SQL = “SELECT Zona_Postal.ID_Zona_Postal, Zona_Postal.ID_Urbanizacion, Urbanizacion.DS_Urbanizacion FROM Zona_Postal INNER JOIN Urbanizacion ON Zona_Postal.ID_Urbanizacion=Urbanizacion.ID_Urbanizacion where Zona_Postal.ID_Ciudad = ” &Area2
dim rs2
Set rs2 = Server.CreateObject(“ADODB.Recordset”)
rs2.Open SQL, adoConn2

do while not rs2.eof
ID=rs2(“ID_Urbanizacion”)
Prueba = Server.HTMLEncode(rs2(“DS_Urbanizacion”))
response.write “” & Prueba & ” ”
rs2.movenext
loop

objRS.Close
adoConn.Close
set objRS = nothing
set adoConn = nothing
%>

—————————————–

Ahora te comento algo, si en lugar de la variable Area2 para el ID coloco un código directo en el siguiente caso 620:

SQL = “SELECT Zona_Postal.ID_Zona_Postal, Zona_Postal.ID_Urbanizacion, Urbanizacion.DS_Urbanizacion FROM Zona_Postal INNER JOIN Urbanizacion ON Zona_Postal.ID_Urbanizacion=Urbanizacion.ID_Urbanizacion where Zona_Postal.ID_Ciudad = 620″

Funciona perfectamente, lo que me hace pensar que el problema esta en la variable que no es transferida a carga_select3, pero no sé como solventarlo.

El código de java quedó de la siguiente manera:

$(document).ready(function(){
$(“#select1″).change(function(){
$.post(“carga_select2.asp”,{ id:$(this).val() },function(data){$(“#select2″).html(data);})
});
$(“#select2″).change(function(){
$.post(“carga_select3.asp”,{ id1:$(this).val() },function(data){$(“#select3″).html(data);})
});
})

————————————–
De verdad no logro ver donde tengo el error.

Gracias por su atención

Perfecto, lo usé para un selector de Estado -> ciudad -> colonia.
cero problemas, mil gracias

[...] y con muy poco código cargamos un combo de forma dinámica con ASP y PHP. También realizamos en un post anterior carga dinamica de combos con jQuery y otro de operaciones básicas con ellos. Ante [...]

desde entre todos las técnicas de la red para hacer esto, esta es la que más me gustó por lo simple y fácil de implementar, se los agradezco.

Saludos.

Hola gente estoy probando el ejemplo pero con asp y no logro que funciones, al parecer cuando selecciono el primer combo no carga el otro y creo que el problema esta en la libreria jquery, si alguien tiene el codigo completo en asp por favor me lo pasa.

Gracias

Saludos

Manuel

muy bien creo para php pero mal explicado para asp no funciona…

Apartentemente algo se cambia pero no logro que muestre datos

Yo creo que mi problema es por mi poco conocimiento pero no puedo hacerlo funcionar. Habria la posibilidad de que suvieras archivos de ejemplo de asp?

Hola amigos,
El ejemplo de Walter lo he modificado a mis necesidades, pero no logro obtener el resultado deseado, reescribo las lineas para saber que esta mal:

en php: (omito algunas lineas para simplificar)

$(document).ready(function(){
$(“#superficie”).change(function(){
$.post(“scripts/carga_calibre.php”,{ id:$(this).val() },function(data){$(“#calibre”).html(data);})
});
})

Seleccione

en carga_calibre.php
<?php
echo "3mm 6mm”;
?>

Como se darán cuenta, dependiendo del resultado de un radio (superficie) necesito se cargue un combo (calibre).
Me podrían ayudar para saber K esta mal ??

Gracias,

Hola amigos,
El ejemplo de Walter lo he modificado a mis necesidades, pero no logro obtener el resultado deseado, reescribo las lineas para saber que esta mal:

en php: (omito algunas lineas para simplificar)
head>
script src=”js/jquery-1.3.2.min.js”>
script>
$(document).ready(function(){
$(“#superficie”).change(function(){
$.post(“scripts/carga_calibre.php”,{ id:$(this).val() },function(data){$(“#calibre”).html(data);})
});
})

input name=”superficie” id=”superficie” type=”radio” value=”acrilico” />
select name=’calibre’ id=’calibre’>
option value=’0′>Seleccione
</select

en carga_calibre.php
?php
echo "3mm 6mm”;
?>

Como se darán cuenta, dependiendo del resultado de un radio (superficie) necesito se cargue un combo (calibre).
Me podrían ayudar para saber K esta mal ??
Va de nuevo pues parece que el codigo se ejecuto al subir mi comentario.

Gracias,

aqui les dejo el mismo ejempro pero utilizando postgres y la libreria adob

Untitled Document

$(document).ready(function(){ //así es como se crean las funciones jQuery. solo cree
$(“#nu_ger”).change(function(){ //se ejecuta con el evento onChange
var varMes = $(this).val() //Devuelve el valor del campo, en este caso el select estatico
$(“#nu_sup”).load(“carga_select2.php”, {paramTipo : 1, paramMes : varMes}); //paramTipo es el parametro pasado por metodo POST
});//change
});//ready

Execute($querysel1) or die($conect->ErrorMsg());?>

Ninguno
EOF){?>
<option value="Fields(‘co_cargo’)?>” >Fields(‘tx_nombre_cargo’)?>
MoveNext();
}
$sel1->MoveFirst(); ?>

Seleccione

y el archivo carga_select2.php es mas sencillo aun pero tiene que recordar que es muy importante tener bien escritas las direcciones virtuales de el archivo jquery y de carga-select2.php ya que por esa tonteria no da error pero no carga el el segundo select y es dificil verlo jejeje

Execute($SQL) or die(“no se conecto”);

//el bucle para cargar las opciones
while (!$rsCons->EOF){
echo “Fields(‘co_cargo’).”>”.$rsCons->Fields(‘tx_nombre_cargo’).”";
$rsCons->MoveNext();
}
$rsCons->close();
?>

por favor soy novato en asp , necesito un codigo en asp con tres combos entrelazados y que muestre los resultados , si alguien tiene el codigo y me lo manda estare mas que agradecido hugo_laforgia@yahoo.com.ar – GRACIAS TOTALES

Hola walter. Muy bueno los codigos.
Me sirvió de mucho ya que yo estoy en un proyecto sobre los productos de una tienda de electrodomesticos.
Los productos peretenecen a una categoria determinada y las categorias pertenecen a una linea determinada.
Muchas gracias por tu aporte. Un abrazo.

bueno lo he implementado pero nose hago un include de la conexion include(“cone.php”); dentro del archivo que carga los combos como carga por medio de ajax al archivo carga.php el no renoce que desde el archivo principal me conecte y aquixas no sabe pq todo pase ajax nose si me hice endender

no igual ya en ultimas dejo como lo tenias con el include dentro del archivo include (“scripts/cnx.php”);

de igual gracias por tu aporte como dice alguien este fue el mas sencillo y facil de implementaar gracias por tu aporte..

lo que me queda por decirque como hariamos para que cuando meustre en combo no muestre caracteres estraños es decir cuando hace la cunsulta en la db algunos campos contienen tildes ñ y etc que n cumplen con utf-8 o con encode pongo en el html

y naaaaa ): por php cmo lo hariamos

igual gracias por tu aporte….

no estan los archivos para descargar, me ayudaria mucho si los tubiera.

alguien me los puede enviar.

saludos.

voy a implementarlo en asp, hay forma de que pueda mandar pro un formulario los valores de los select en asp? se puede implementar una imagen de loading en el select que se esta cargando?? gracias por la ayuda

a mi tambien me gustaria, como dra duran, poner el …cargando y no se como hacerlo…

alguien sabe?

gracias de antemano

No me funciona el select3
//——————————————- Select.php

Demo – Combos Dependientes

$(document).ready(function(){
$(“#select1″).change(function(){
$.post(“carga_select2.php”,{ id:$(this).val() },function(data){$(“#select2″).html(data);})
});
$(“#select2″).change(function(){
$.post(“carga_select3.php”,{ id:$(this).val() },function(data){$(“#select3″).html(data);})
});

})

Cable:
— Seleccione —
49 and Cable< 62 ";
break;
case 'E':
$cab_where = " WHERE Cable IN(57, 58, 59) ";
break;
}

$cable = "SELECT distinct(Cable) FROM Plantel".$cab_where;

$req = mysql_query($cable) or die("Error Consulta SOLICITUD:”.mysql_errno().” : “.mysql_error().”");
while($row_cable = mysql_fetch_array($req)) {
echo “”.$row_cable["Cable"].”" ;
}
?>

Caja:
— Seleccione —

Caja:
— Seleccione —

//————————————— carga_select2.php
<?php
//Creado por Cesar Walter Gerez en Micodigobeta.com.ar
//A manera de ejemplo solo lo realizo con array, pero para que realmente sea dinamico se debería traer las opciones de una base de datos.
$Opcion= $_REQUEST["id"];
require "../conf/conn.php";
$query_caja ="SELECT Cable,Caja,Descripcion FROM Caja WHERE Cable = '$Opcion'";
$req = mysql_query($query_caja) or die("Error SELECT CAJA:”.mysql_errno().” : “.mysql_error().”");
echo ” — Seleccione — “;
while($row_c = mysql_fetch_array($req)) {
echo “”.$row_c["Caja"].”-”.$row_c["Descripcion"].”" ;
}
?>

//————————————— carga_select3.php
<?php
echo " — SELECCIONAR — “;
?>

alguna ayuda porf.