Lista Dependiente con Javascript + Asp

jahman · #1 (**permalink**) 31/08/2007, 17:38

Hola a todos, basicamente lo que necesito es un lista que no actualize la pagina asi que decidi hacer una que genere sus opciones a partir de un javascript sin actualizar la pagina para asi no perder los valores de los campos de textos anteriores, el problema es que no logro hacer que apartir de una seleccion muestre la segunda lista, ojala me puedan ayudar.

Código HTML:

<!--#include file="../Connections/acceso.asp" -->
<head>
<title></title>
<script language="javascript">
function ComponerLista(xPro) {
document.forms.frmDatos.selCiudades.disabled = true;
document.forms.frmDatos.selPropiedades.length = 0;
CargarPropiedades(xPro);
document.forms.frmDatos.selCiudades.disabled = false; 
}
function CargarPropiedades(xCiu) {
var o
document.forms.frmDatos.selPropiedades.disabled=true;

<%

' aca es donde no logro que reciba ni que genere la lista '

	Set SelectII = Server.CreateObject("ADODB.Recordset")
	SelectII.ActiveConnection = MM_acceso_STRING
	SelectII.Source="SELECT DISTINCT SecondOp FROM TreeDatosFCR_index WHERe FirstOp ='"&selCiudades&"' ORDER BY SecondOp"
	SelectII.CursorType = 1
	SelectII.CursorLocation = 2
	SelectII.LockType = 1
	SelectII.Open()
	
while (NOT SelectII.EOF) %>
		o = document.createElement("OPTION");
		o.text = <%=SelectII.Fields("SecondOp")%>;
		o.value = <%=SelectII.Fields("SecondOp")%>;
		document.forms.frmDatos.selPropiedades.options.add (o);
	<% SelectII.movenext()
	wend %> 
	document.forms.frmDatos.selPropiedades.disabled=false;

}
</script>
</head>
<body>
<form id="frmDatos" name="frmDatos" method="post" action="">
<!-- Genero la primera lista -->
<select name="selCiudades"  id="selCiudades" onChange="ComponerLista(document.forms.frmDatos.selCiudades[selectedIndex].value);">
		<option>-- Select --</option>
		<%
			Set SelectI = Server.CreateObject("ADODB.Recordset")
			SelectI.ActiveConnection = MM_acceso_STRING
			SelectI.Source = "SELECT DISTINCT FirstOp FROM TreeDatosFCR_index order by FirstOp "
			SelectI.CursorType = 1
			SelectI.CursorLocation = 2
			SelectI.LockType = 1
			SelectI.Open()
		while NOT SelectI.EOF %>
		<option value="<%=SelectI.Fields("FirstOp")%>"><%=SelectI.Fields("FirstOp")%></option>
		<% SelectI.movenext()
		Wend%>
	</select>
	<br>

<!-- Segunda lista -->
<select name="selPropiedades" id="selPropiedades">
</select>
</form>
</body>
</html>

tammander · #2 (**permalink**) 01/09/2007, 01:46

Entonces lo que necesitas es utilizar llamadas asincronas al servidor. Tal y como lo tienes, el navegador "dibujará" el combo selpropiedades con los valores que haya leido al cargar la página y no cambiaran sus datos por mucho que lanzes el evento onChange del combo selCiudades.

Para realizar llamadas asincronas debes usar la tecnologia AJAX. Esta crear un objeto XMLHTMLRequest desde javascript que se encarga de realizar dichas llamadas a un segundo script que es el que devuelve los datos según lo seleccionado en el primer combo.

Aqui puedes ver como funciona AJAX.

Aqui un manual en español.

Tambien te recomendaría que buscaras en el foro de AJAX donde seguramente te asesorarán mucho mejor que aqui

Un saludo

tunait · #3 (**permalink**) 01/09/2007, 01:55

Buenas ...

mira a ver si te puede orientar este tutorial que publiqué hace algún tiempo http://www.tunait.com/tutoriales/lis...saspaccess.php.

saludos