Ver Mensaje Individual
  #26 (permalink)  
Antiguo 07/02/2007, 19:22
Avatar de luisvasquez
luisvasquez
 
Fecha de Ingreso: diciembre-2003
Ubicación: Venezuela
Mensajes: 879
Antigüedad: 20 años, 11 meses
Puntos: 6
De acuerdo Re: combobox dependientes con ajax.

Amigos,

Necesito más que un par de ojos para ver lo que está mal...he revisado línea por línea comparando los scripts PHP con los ASP traducidos y no veo ABSOLUTAMENTE ninguna razón por la que el formulario no toma los valores de los selects de estado y ciudad cuando uso Firefox..

Aca va el código ASP producto de la traducción a ver si alguien ve algo que no estoy viendo...mucho sabré agradecerles la ayuda que puedan prestarme...

select_dependientes_3_niveles.asp

Este script presenta el formulario para elegir de las listas los valores...al presionar el botòn, nos muestra los valores de los 3 Selects. El problema es que solo los muestra con IE y no lo hace con Mozilla Firefox...sinceramente no he probado con ningún otro navegador...

OJO : Solo Venezuela tiene estados y ciudades...

Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<% 
  public cnn
  
  ' Funcion para abrir la Base de datos
function abrir_bd()
  dim rs 
  on error resume next
  set cnn = Server.CreateObject("adodb.connection")
  ' Conexion con Access
  xDb_Conn_Str = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.MapPath("test.mdb") & ";"
  cnn.open xDb_Conn_Str

end function

' Funcion para cerrar la B/D
function cerrar_bd()
 on error resume next
 rs.close
 cnn.close
end function


' Genera el primer select con los paises
sub generaselect()
    call abrir_bd()
	sql = "select * from pais order by desc_pais_larga asc" 
	set rs = cnn.execute(sql)
       
	' Voy imprimiendo el primer select compuesto por los paises
	Response.Write "<select class=""combo"" id=""select_1"" name=""paises"" onChange=""cargaContenido(2)"">"
	Response.Write("<option value='0'>Elige  </option>")
	While not Rs.EOF
		Response.Write "<option value=""" & rs("cod_pais") & """>" & rs("desc_pais_larga") & "</option>"
		Rs.MoveNext
	Wend
	Response.Write "</select>"
	call cerrar_bd()
End sub
%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ejemplo</title>


<script language="javascript" type="text/javascript">
function nuevoAjax()
{ 
	/* Crea el objeto AJAX. Esta funcion es generica para cualquier utilidad de este tipo, por
	lo que se puede copiar tal como esta aqui */
	var xmlhttp=false; 
	try 
	{ 
		// Creacion del objeto AJAX para navegadores no IE
		xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); 
	}
	catch(e)
	{ 
		try
		{ 
			// Creacion del objet AJAX para IE 
			xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
		} 
		catch(E) { xmlhttp=false; }
	}
	if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp=new XMLHttpRequest(); } 

	return xmlhttp; 
}

function cargaContenido(selectACargar)
{
	// Recibo el número correspondiente al combo que se debe llenar de datos
	var selectAnterior=selectACargar-1; // Obtengo el número del combo que activó el evento onChange
	// Extraigo el valor del combo que se ha cambiado
	var valor=document.getElementById("select_"+selectAnterior).options[document.getElementById("select_"+selectAnterior).selectedIndex].value;
	var elemento;
	
	if(valor!=0)
	{
		ajax=nuevoAjax();
		// Envio al servidor el valor seleccionado y el combo al cual se le deben poner los datos
		ajax.open("GET", "select_dependientes_3_niveles_proceso.asp?seleccionado="+valor+"&select_a_cargar="+selectACargar, true);
		ajax.onreadystatechange=function() 
		{ 
			if (ajax.readyState==1)
			{
				// Mientras carga elimino la opcion "Elige" y pongo una que dice "Cargando"
				elemento=document.getElementById("select_"+selectACargar);
				elemento.length=0;
				var opcionCargando=document.createElement("option"); opcionCargando.value=0; opcionCargando.innerHTML="Cargando...";
				elemento.appendChild(opcionCargando); elemento.disabled=true;	
			}
			if (ajax.readyState==4)
			{
				// Coloco en la fila contenedora los datos que recivo del servidor
				document.getElementById("fila_"+selectACargar).innerHTML=ajax.responseText;
			} 
		}
		ajax.send(null);
	}
	
	/* Colocamos mediante los whiles los selects en "Selecciona opción..." cuando el select anterior
	ha quedado en estado "Elige" */
	var x=1, y=null;
	while(x<=2)
	{
		valor=document.getElementById("select_"+x).options[document.getElementById("select_"+x).selectedIndex].value;
		if(valor==0)
		{
			while(x<=2) 
			{
				y=x+1;
				elemento=document.getElementById("select_"+y);
				elemento.length=0;
				var opcionSelecciona=document.createElement("option"); opcionSelecciona.value=0; opcionSelecciona.innerHTML="Selecciona opci&oacute;n...";
				elemento.appendChild(opcionSelecciona); elemento.disabled=true;
				x++;
			}
		}
		x++;
	}
	
}
</script>

<style type="text/css"> 
.punteado 
{ 
	border-style:dotted; 
	border-color:#000000; 
	background-color:#EAEAEA;
	font-family:Verdana; 
	font-size:10px; 
	text-align:center;
}

.combo
{
	font-family:Verdana; 
	font-size:10px; 
	border-color:#CCCCCC;
}
</style>
</head>

<body>
<center>
 <% if request.Form = "" then ' Si es primera vez que entra a la pàgina, entonces muestra las listas para elegir los valores.%>
 
<table border="1" width="600px" style="border-style:none;">
<form action="" method="post" name="registro">
  <tr>
    <td id="fila_1" width="200px" class="punteado"><% generaSelect() %></td>

	<td id="fila_2" width="200px" class="punteado">
	
		<select class="combo" disabled="disabled" id="select_2" name="select_2">
		<option  value="0">Selecciona opci&oacute;n...</option>
		</select>
	</td>

	<td id="fila_3" width="200px" class="punteado">
		<select class="combo" disabled="disabled" id="select_3" name="select_3">
		<option  value="0">Selecciona opci&oacute;n...</option>
		</select>
	</td>
  </tr>
  <input name="Botón" type="submit">
  </form>
</table>

 <% else ' La segunda vez que entra a la forma, solo muestra los datos
 
   response.Write("Select 1:"&request.form("paises")&"<BR>Select 2:"&request.form("select_2")&"<BR>Select 3:"&request.form("select_3"))
 
  end if %>
</center>
</body>
</html>
Y aca vá el script que genera los selects dependientes y que es invocado usando Ajax.

select_dependientes_3_niveles_proceso.asp

Código:
<%  

 public cnn
  
  ' Funcion para abrir la Base de datos
function abrir_bd()
  dim rs 
  on error resume next
  set cnn = Server.CreateObject("adodb.connection")
  ' Conexion con Access
  xDb_Conn_Str = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.MapPath("test.mdb") & ";"
  cnn.open xDb_Conn_Str

end function

' Funcion para cerrar la B/D
function cerrar_bd()
 on error resume next
 rs.close
 cnn.close
end function


cod_a_buscar    = Request.QueryString("seleccionado")
select_a_cargar = request.QueryString("select_a_cargar")

call abrir_bd()
	' Comienzo a imprimir el select
	if select_a_cargar=2 then
response.Write "<select class='combo' onChange='cargaContenido(3)' id='select_2' name='select_2'>"
		sql = "select * from estado where cod_pais ="&cod_a_buscar&" order by desc_estado asc" 
	else
		response.Write("<select class='combo' id='select_3' name='select_3'>")
		sql = "select * from poblaciones where cod_estado ="&cod_a_buscar&" order by desc_poblacion_larga asc" 
    End if		
	
	response.Write("<option value='0'>Elige</option>")
	set rs = cnn.execute(sql)
    if err.number <> 0 then
      response.redirect "mensaje_soporte.asp?error="&Server.Urlencode(dictLanguage.Item(session("idioma")&"_mensaje_soporte_02")&Err.number)	  
    End if
    While Not Rs.EOF
	   if select_a_cargar = 2 then
	      codigo =  Rs("cod_estado")
		  desc   =  Server.HtmlEncode(Rs("desc_estado"))
	   Else
	      codigo =  Rs("cod_poblacion")
		  desc   =  Server.HtmlEncode(Rs("desc_poblacion_larga"))
	   End if	      
	 ' Imprimo las opciones del select
	   response.Write "<option value=""" & codigo & """>" & desc & "</option>"
	   Rs.MoveNext
   Wend
   response.Write "</select>"


call cerrar_bd()
%>

Aca va el vinculo en mi PC donde se ejecutan dichos Scrpts

Si desean modificar y probar el código en sus propias maquinas, aca está la base de datos Access

Por favor, echenle un ojo a esto a ver si es que hay algo que Firefox pudiese no gustarle..

Saludos y muchas gracias por su ayuda,
Luis Vásquez

Última edición por luisvasquez; 07/02/2007 a las 19:23 Razón: Error ortográfico