3 combos enlazados
Tengo una página con unos combobox enlazados, el problema es que no se como se hace para que cuando un combo cambie el otro cambie también, lo único que conseguí fue este código pero no tengo idea de javascript, si alguno me puede dar una mano con eso, o decir como se hace se los agradecería. Si tienen algo más fácil también se los agradezco
Saludos
Sergio
P.D. Les paso el código que tengo que baje de internet para adaptarlo.
<HTML>
<HEAD>
<TITLE>Listas </TITLE>
</HEAD>
<BODY>
<H2><CENTER>Listas </CENTER></H2>
<FORM NAME="Listas" METHOD="POST" ACTION="receive.asp">
<B>Pais</B>
<SELECT NAME="Categorias" SIZE="1"
OnChange="ComponerLista (document.forms.Listas.Categorias[selectedIndex].value);">
<%
Dim oConn, rs, SQL, cuenta, categoria
set oConn=Server.CreateObject("ADODB.Connection")
set rs=Server.CreateObject("ADODB.Recordset")
oConn.Open "DRIVER={Microsoft Access Driver (*.mdb)}; DBQ=" & Server.MapPath("bd\Negocios.mdb")
SQL="SELECT * FROM pa"
rs.Open SQL, oConn
cuenta=1
while not rs.EOF
%>
<OPTION VALUE="<%=rs.Fields("IdPais")%>"
<% if cuenta=1 then%>
SELECTED
<%end if%>>
<%=rs.Fields("Pais")%></OPTION>
<%
rs.MoveNext
cuenta=cuenta+1
wend
rs.Close
%>
</SELECT>
<P><B>provincia</B>
<SELECT NAME="Productos" SIZE="1">
</SELECT>
<br>
<br>
ciudad
<SELECT NAME="Productos2" SIZE="1">
</SELECT>
<br>
<br>
<P><INPUT TYPE="submit"></FORM>
<SCRIPT LANGUAGE="Javascript">
<!--
function Tupla ( campo1, campo2 )
{
this.campo1 = campo1;
this.campo2 = campo2;
}
<%
'Vamos a crear nuestros arrays de productos desde ASP
'El primer if detecta un cambio en la categoría para
'crear un nuevo array en Javascript
SQL="SELECT * FROM Provi "
rs.Open SQL, oConn
cuenta=0
cat="basura"
while not rs.EOF
if cat<>rs.Fields("Idpais") then
' cambio de categoria, empiezo a contar en 0
cuenta=0
cat=rs.Fields("Idpais")
%>
var opciones<%=cat%> = new Array();
<%
end if
%>
opciones<%=cat%>[<%=cuenta%>]=new Tupla("<%=rs.Fields("provincia")%>","<%=rs.Fields("IdProvincia")%>");
<%
cuenta=cuenta+1
rs.MoveNext
wend
%>
<%
'Limpiamos objetos
rs.Close
set rs=nothing
oConn.Close
set oConn=nothing
%>
var contador;
function ComponerLista ( array ) {
// Compone la lista dependiente a partir
// del valor de la opcion escogida en la lista "padre"
BorrarLista();
array = eval("opciones" + array);
for (contador=0; contador<array.length; contador++)
{
// añade elementos nuestro combobox
var optionObj = new Option( array[contador].campo1, array[contador].campo2);
Listas.Productos.options[contador] = optionObj;
} // for
} // ComponerLista
function BorrarLista() {
Listas.Productos.length=0;
}
//Inicializamos
ComponerLista (1);
-->
</SCRIPT>
<br>
</FORM>
</BODY>
</HTML>
Saludos
Sergio
P.D. Les paso el código que tengo que baje de internet para adaptarlo.
<HTML>
<HEAD>
<TITLE>Listas </TITLE>
</HEAD>
<BODY>
<H2><CENTER>Listas </CENTER></H2>
<FORM NAME="Listas" METHOD="POST" ACTION="receive.asp">
<B>Pais</B>
<SELECT NAME="Categorias" SIZE="1"
OnChange="ComponerLista (document.forms.Listas.Categorias[selectedIndex].value);">
<%
Dim oConn, rs, SQL, cuenta, categoria
set oConn=Server.CreateObject("ADODB.Connection")
set rs=Server.CreateObject("ADODB.Recordset")
oConn.Open "DRIVER={Microsoft Access Driver (*.mdb)}; DBQ=" & Server.MapPath("bd\Negocios.mdb")
SQL="SELECT * FROM pa"
rs.Open SQL, oConn
cuenta=1
while not rs.EOF
%>
<OPTION VALUE="<%=rs.Fields("IdPais")%>"
<% if cuenta=1 then%>
SELECTED
<%end if%>>
<%=rs.Fields("Pais")%></OPTION>
<%
rs.MoveNext
cuenta=cuenta+1
wend
rs.Close
%>
</SELECT>
<P><B>provincia</B>
<SELECT NAME="Productos" SIZE="1">
</SELECT>
<br>
<br>
ciudad
<SELECT NAME="Productos2" SIZE="1">
</SELECT>
<br>
<br>
<P><INPUT TYPE="submit"></FORM>
<SCRIPT LANGUAGE="Javascript">
<!--
function Tupla ( campo1, campo2 )
{
this.campo1 = campo1;
this.campo2 = campo2;
}
<%
'Vamos a crear nuestros arrays de productos desde ASP
'El primer if detecta un cambio en la categoría para
'crear un nuevo array en Javascript
SQL="SELECT * FROM Provi "
rs.Open SQL, oConn
cuenta=0
cat="basura"
while not rs.EOF
if cat<>rs.Fields("Idpais") then
' cambio de categoria, empiezo a contar en 0
cuenta=0
cat=rs.Fields("Idpais")
%>
var opciones<%=cat%> = new Array();
<%
end if
%>
opciones<%=cat%>[<%=cuenta%>]=new Tupla("<%=rs.Fields("provincia")%>","<%=rs.Fields("IdProvincia")%>");
<%
cuenta=cuenta+1
rs.MoveNext
wend
%>
<%
'Limpiamos objetos
rs.Close
set rs=nothing
oConn.Close
set oConn=nothing
%>
var contador;
function ComponerLista ( array ) {
// Compone la lista dependiente a partir
// del valor de la opcion escogida en la lista "padre"
BorrarLista();
array = eval("opciones" + array);
for (contador=0; contador<array.length; contador++)
{
// añade elementos nuestro combobox
var optionObj = new Option( array[contador].campo1, array[contador].campo2);
Listas.Productos.options[contador] = optionObj;
} // for
} // ComponerLista
function BorrarLista() {
Listas.Productos.length=0;
}
//Inicializamos
ComponerLista (1);
-->
</SCRIPT>
<br>
</FORM>
</BODY>
</HTML>
1 Respuesta
Respuesta de smunoz
1
Así a bote pronto, parece que cuando cambias algo del primer combo, se regenera el segundo. Esta es una manera de hacerlo.
Otra manera es tener cargados varios combos, si son de pocos elementos, y hacerlos visibles o invisibles según convenga, todos en el mismo sitio. Así, según el valor del primer combo, haces desaparecer uno de los "segundos" y haces aparecer otro en su lugar.
Otra posibilidad, cuando los combos son complejos, es utilizar IFRAMEs que carguen una página con un combo. Cuando cambies el valor del primero, cargas la página del IFRAME pasando los parámetros necesarios para cargar el segundo combo.
En fin, que posibilidades hay muchas.
Otra manera es tener cargados varios combos, si son de pocos elementos, y hacerlos visibles o invisibles según convenga, todos en el mismo sitio. Así, según el valor del primer combo, haces desaparecer uno de los "segundos" y haces aparecer otro en su lugar.
Otra posibilidad, cuando los combos son complejos, es utilizar IFRAMEs que carguen una página con un combo. Cuando cambies el valor del primero, cargas la página del IFRAME pasando los parámetros necesarios para cargar el segundo combo.
En fin, que posibilidades hay muchas.
Tienes algo armado para que pueda verlo, porque lo que no puedo hacer es que en base al segundo cambie el tercero
No tengo ningún ejemplo. Hablo en base a mis conocimientos.
Para hacer que el tercero cambie con el segundo, dependiendo del método que emplees, tendrás que hacer que el comportamiento del segundo sea como el primero. O sea, si usas Javascript como el ejemplo que expones, deberás capturar el evento "onchange" del segundo para ejecutar un "ComponerLista" con el tercero. Si es mediante IFRAMEs, deberás también´n capturar el "onchange" (o el "onclick"), y actualizar el contenido del IFRAME que contiene la página con el tercer combo. En el caso de los IFRAMEs, has de tener en cuenta que las páginas (o ventanas) que hay dentro de un IFRAME son "hijas" de la página o ventana donde están definidos. Por ejemplo, para acceder desde dentro del primer IFRAME (índice 0) al segundo IFRAME (índice 1)debes recurrir al objeto "self.parent.frames(1)".
Para hacer que el tercero cambie con el segundo, dependiendo del método que emplees, tendrás que hacer que el comportamiento del segundo sea como el primero. O sea, si usas Javascript como el ejemplo que expones, deberás capturar el evento "onchange" del segundo para ejecutar un "ComponerLista" con el tercero. Si es mediante IFRAMEs, deberás también´n capturar el "onchange" (o el "onclick"), y actualizar el contenido del IFRAME que contiene la página con el tercer combo. En el caso de los IFRAMEs, has de tener en cuenta que las páginas (o ventanas) que hay dentro de un IFRAME son "hijas" de la página o ventana donde están definidos. Por ejemplo, para acceder desde dentro del primer IFRAME (índice 0) al segundo IFRAME (índice 1)debes recurrir al objeto "self.parent.frames(1)".
