Como llenar un ComboBox en relacion con otro

Joe Pe?
18 de Julio del 2002
Me explico...
Si tengo dos ComboBox, uno encima del otro y quiero que cuando yo cambie de item en el de arriba, abajo se llene de item nuevos q yo le pueda especificar.

Como puedo hacer eso?

Federico Gonzalez
18 de Julio del 2002
Hola, estaba leyendo lo tuyo y yo estoy buscando hacer lo mismo.
Tengo una idea de cómo hacerlo pero estoy trabado en una parte.
Te cuento cómo lo estoy haciendo, de paso, si lograste hacerlo te pido que me envíes el código.

Estoy usando bases de datos, así que te lo cuento con todo.

Levanto con asp en un recordset para cada combo lo que preciso. Creo con javascript un array donde almaceno lo del recordset.

Teniendo en cuenta el combo superior, recorro el array filtrandolo y voy agregando lineas al combo inferior (que previamente limpie).

te paso el codigo para agregar lineas y limpiar el combo:

function select_clear(idselect) {
var j = idselect.length;
for (i=0; i<j; i++) {
idselect.remove(1);
}
}

function select_add(idselect,text,value) {
elemento = document.createElement("OPTION");
elemento.text= text;
elemento.value= value;
idselect.add(elemento);
}

A estos los hice recién y funcionan bien.

En lo otro estoy trabajando ahora, cuando termine, si me contestas este mail para saber que te llegó y tener tu direccion, te cuento lo otro.

saludos, Federico


Lupita
18 de Julio del 2002
Hola Federico,

Respecto a tu código, cómo le haces para que te reconozca una variable definida en un lenguaje diferente como puede ser ASP, HTML, PHP, etc, en JavaScript. Ya hice lo mismo que tú, con PHP desplegué información de una base de datos en combos, pero ahora quiero relacionarlos entre si con JavaScript, solo que desconozco como utilizar el arreglo creado en PHP en JavaScript. Estaré muy agradecida el que me indiquen como hacerlo.
Gracias y saludos.

MA.G.G.B.

rapomon
18 de Julio del 2002
La semana pasada publiqué como hacerlo pero con asp (cargando en la segunda lista unos determinados valores de acuerdo al valor seleccionado en le primera lista).

Ahora os paso un código javascript que nos filtra los valores en tiempo real, en la propia página sin necesidad de volverla a cargar. Aquí tenéis el código, copiarlo y pegarlo en un fichero .html:






<html>
<head><title>Dos listas relacionadas</title>
<SCRIPT LANGUAGE="JavaScript">
<!--

var ar = new Array();

ar[0] = new Array();
ar[0][0] = new makeOption("level11");
ar[0][1] = new makeOption("level12");
ar[0][2] = new makeOption("level13");

ar[1] = new Array();
ar[1][0] = new makeOption("level21");
ar[1][1] = new makeOption("level22");
ar[1][2] = new makeOption("level23");

ar[2] = new Array();
ar[2][0] = new makeOption("level31");
ar[2][1] = new makeOption("level32");
ar[2][2] = new makeOption("level33");


function makeOption(text) {
this.text = text;
}

function relate(form) {
var options = form.list.options;
for (var i = options.length - 1; i > 0; i--) {
options[i] = null;
}
var curAr = ar[form.topics.selectedIndex];
for (var j = 0; j < curAr.length; j++) {
options[j] = new Option(curAr[j].text);
}
options[0].selected = true;

}

// -->
</SCRIPT>
</head>

<body>

<FORM NAME="menu">
<SELECT NAME="topics" onChange="relate(this.form)">
<OPTION VALUE="" SELECTED>level1
<OPTION VALUE="">level2
<OPTION VALUE="">level3
</SELECT>

<SELECT NAME="list">
<OPTION VALUE="" SELECTED>level11
<OPTION VALUE="">level12
<OPTION VALUE="">level13
</SELECT>
</FORM>

</body>
</html>

Anibal
18 de Julio del 2002
como puedo hacer lo mismo pero con base de datos no con codigo fijo......
haber si lo puedes modificar....

rivelo
18 de Julio del 2002
les envio el codigo
<script language="JavaScript">
<!--

var arrDynaList2 = new Array();

var arrDL2 = new Array();

arrDL2[1] = "selList1"; // Name of parent list box
arrDL2[2] = "form1"; // Name of form containing parent list box
arrDL2[3] = "selList2"; // Name of child list box
arrDL2[4] = "form1"; // Name of form containing child list box
arrDL2[5] = arrDynaList2;

<%
Dim txtDynaListRelation2, txtDynaListLabel2, txtDynaListValue2, oDynaListRS2

txtDynaListRelation2 = "municipioidmunicipio" ' Name of recordset field relating to parent
txtDynaListLabel2 = "nombrelocalidad" ' Name of recordset field for child Item Label
txtDynaListValue2 = "idlocalidad" ' Name of recordset field for child Value
Set oDynaListRS2 = RSList2 ' Name of child list box recordset

Dim varDynaList2
varDynaList2=-1

While (NOT oDynaListRS2.EOF)

%>
arrDynaList2[<%=(varDynaList2+1)%>] = "<%=(oDynaListRS2.Fields.Item(txtDynaListRelation2).Value)%>"
arrDynaList2[<%=(varDynaList2+2)%>] = "<%=(oDynaListRS2.Fields.Item(txtDynaListLabel2).Value)%>"
arrDynaList2[<%=(varDynaList2+3)%>] = "<%=(oDynaListRS2.Fields.Item(txtDynaListValue2).Value)%>"
<%
varDynaList2 = varDynaList2 + 3
oDynaListRS2.MoveNext
Wend
%>

//-->
</script>
<!-- End of object/array definitions, beginning of generic functions -->
<script language="JavaScript">
<!--

function setDynaList(arrDL){

var oList1 = document.forms(arrDL[2]).elements(arrDL[1]);
var oList2 = document.forms(arrDL[4]).elements(arrDL[3]);
var arrList = arrDL[5];

clearDynaList(oList2);

if (oList1.selectedIndex == -1){
oList1.selectedIndex = 0;
}

populateDynaList(oList2, oList1[oList1.selectedIndex].value, arrList);
return true;
}

function clearDynaList(oList){

for (var i = oList.options.length; i >= 0; i--){
oList.options[i] = null;
}

oList.selectedIndex = -1;
}

function populateDynaList(oList, nIndex, aArray){

for (var i = 0; i < aArray.length; i= i + 3){
if (aArray[i] == nIndex){
oList.options[oList.options.length] = new Option(aArray[i + 1], aArray[i + 2]);
}
}

if (oList.options.length == 0){
oList.options[oList.options.length] = new Option("[none available]",0);
}

oList.selectedIndex = 0;
}

//-->
</script>