Sistema para que las opciones de un select se vinculen a lo que se ha seleccionado en otro select, manteniendo todas las opciones en una base de datos.
Este es un sistema de "selects dependientes" (es decir, que interactúan el uno con el otro),
tomando a la vez los datos desde una base de datos Access.
Sólo será necesario 1 módulo ASP (selecs_dependientes.asp) y la base de datos correspondiente (ssdd.mdb).
En este ejemplo, se trabajará con dos selects:
- Uno de países
- Otro de provincias o comunas
Base de datos ssdd.mdb
La base de datos deberá contener dos tablas relacionadas entre sí.
Con una relación entre tablas como esta:
selects_dependientes.asp
La página ASP es bastante sencilla de entender. Se trata de un script para construir los dos campos select a partir de los valores de la base de datos.
La primera vez que carga la página se muestra únicamente el primer campo select con los valores que extrae de la tabla de países. Al campo select se le ha incluído el evento Javascript onchange para que, en el momento que cambie la opción seleccionada, se cargue la página pasándo por parámetro el identificador del país seleccionado.
La segunda vez que carga la página -porque se cambió el valor del primer select- recibe por la URL el identificador del país seleccionado. Entonces muestra el segundo select con las opciones relacionadas con el país que recibe por parámetro, es decir, si seleccionó el país Argentina, se cargarán únicamente las provincias de ese país.
El código del ejemplo quedaría de esta manera.
<form name=formulario>
PAÍS: <select name=idPais onChange="location.href('selects_dependientes.asp?idPais=' + formulario.idPais.options[formulario.idPais.selectedIndex].value)">
<%
Set Conn = Server.CreateObject("ADODB.Connection")
Conn.Open("DRIVER={Microsoft Access Driver (*.mdb)}; DBQ=" & Server.MapPath("ssdd.mdb"))
SQL_pais="select * from paises order by pais asc"
set RS_pais=createobject("ADODB.Recordset")
RS_pais.open SQL_pais,conn
do while not RS_pais.eof
pais = RS_pais("pais")
idPais = RS_pais("idPais")
p = request.querystring("pais")
if p <> "" then
if p = pais then
response.write "<option value="&idPais&"&pais="&pais&" selected>"&pais&"</option>"
elseif p <> pais then
response.write "<option value="&idPais&"&pais="&pais&">"&pais&"</option>"
end if
else
response.write "<option value="&idPais&"&pais="&pais&">"&pais&"</option>"
end if
RS_pais.movenext
loop
RS_pais.close
%>
</select>
<% if request.querystring("idPais") <> "" then %>
PROVINCIA: <select name=ubicacion>
<%
SQL_prov="select * from provincias where pais="&request.querystring("idPais")&" order by provincia asc"
set RS_prov=createobject("ADODB.Recordset")
RS_prov.open SQL_prov,conn
do while not RS_prov.eof
pais = request.querystring("pais")
provincia = RS_prov("provincia")
%>
<option value="<%=provincia%>, <%=pais%>"><%=provincia%></option>
<%
RS_prov.movenext
loop
RS_prov.close
%>
</select><% end if %></form>
Se pueden descargar los archivos relacionados con este taller. (Base de datos, script y comentario del autor)
Sólo será necesario 1 módulo ASP (selecs_dependientes.asp) y la base de datos correspondiente (ssdd.mdb).
Referencia: Tenemos otro ejemplo de selects dependientes en el que se trabaja únicamente del lado del cliente con Javascript, para el que le interese más una opción como esa. |
En este ejemplo, se trabajará con dos selects:
- Uno de países
- Otro de provincias o comunas
Base de datos ssdd.mdb
La base de datos deberá contener dos tablas relacionadas entre sí.
TABLA | CAMPOS |
paises | idPais (autonumérico) [clave principal] pais (texto) |
provincias | pais (numero) idProvincia (autonumérico) [clave principal] provincia (texto) |
Con una relación entre tablas como esta:
selects_dependientes.asp
La página ASP es bastante sencilla de entender. Se trata de un script para construir los dos campos select a partir de los valores de la base de datos.
La primera vez que carga la página se muestra únicamente el primer campo select con los valores que extrae de la tabla de países. Al campo select se le ha incluído el evento Javascript onchange para que, en el momento que cambie la opción seleccionada, se cargue la página pasándo por parámetro el identificador del país seleccionado.
La segunda vez que carga la página -porque se cambió el valor del primer select- recibe por la URL el identificador del país seleccionado. Entonces muestra el segundo select con las opciones relacionadas con el país que recibe por parámetro, es decir, si seleccionó el país Argentina, se cargarán únicamente las provincias de ese país.
El código del ejemplo quedaría de esta manera.
<form name=formulario>
PAÍS: <select name=idPais onChange="location.href('selects_dependientes.asp?idPais=' + formulario.idPais.options[formulario.idPais.selectedIndex].value)">
<%
Set Conn = Server.CreateObject("ADODB.Connection")
Conn.Open("DRIVER={Microsoft Access Driver (*.mdb)}; DBQ=" & Server.MapPath("ssdd.mdb"))
SQL_pais="select * from paises order by pais asc"
set RS_pais=createobject("ADODB.Recordset")
RS_pais.open SQL_pais,conn
do while not RS_pais.eof
pais = RS_pais("pais")
idPais = RS_pais("idPais")
p = request.querystring("pais")
if p <> "" then
if p = pais then
response.write "<option value="&idPais&"&pais="&pais&" selected>"&pais&"</option>"
elseif p <> pais then
response.write "<option value="&idPais&"&pais="&pais&">"&pais&"</option>"
end if
else
response.write "<option value="&idPais&"&pais="&pais&">"&pais&"</option>"
end if
RS_pais.movenext
loop
RS_pais.close
%>
</select>
<% if request.querystring("idPais") <> "" then %>
PROVINCIA: <select name=ubicacion>
<%
SQL_prov="select * from provincias where pais="&request.querystring("idPais")&" order by provincia asc"
set RS_prov=createobject("ADODB.Recordset")
RS_prov.open SQL_prov,conn
do while not RS_prov.eof
pais = request.querystring("pais")
provincia = RS_prov("provincia")
%>
<option value="<%=provincia%>, <%=pais%>"><%=provincia%></option>
<%
RS_prov.movenext
loop
RS_prov.close
%>
</select><% end if %></form>
Se pueden descargar los archivos relacionados con este taller. (Base de datos, script y comentario del autor)
Eugenia Bahit
Analista Programadora LAMP y Scrum Coach