combobox dependientes con ajax.

[sjam7]

Bueno, aunque es un tema viejo revivido recientemente pondre mi solucion para sus comentarios y por si de algo sirve, aclaro que no soy un experto ni en ASP ni mucho menos en AJAX, pero pues es una forma muy simple que yo estoy utilizando en algunos sitios actualmente, en este caso pondre uno para 3 selects dependientes:

1.- Necesitamos un archivo JS que se puede descargar aqui: ajax_loader.js

Y lo ponemos entre las etiquetas HEAD asi:
<script src="ajax_loader.js" type="text/javascript"></script>

2.- En el HTML armamos nuestros combos dependientes, podria haber 2 formas de hacerlo, una seria ir poniendo los combos hasta que se haya seleccionado el combo anterior o bien, poner los 3 combos desde un principio.

Aqui vamos a ponerlo de la segunda forma:

Aqui ponemos el codigo del primer select utilizando ahi mismo la conexion a la base de datos si asi lo requiere:

Código html:

<%Set RSt = Server.CreateObject("ADODB.Recordset")
        SQLt="Select * from TABLA order by id ASC"
        RSt.open sqlt, conexion%>
        <select name="servicio" class="sel" onChange="htmlData('[B]cambia.asp[/B]', '[B]select2[/B]', '[B]en=1&ser='+servicio.value[/B])">
            <option value=""> -- Selecciona una opcion -- </option>
            <%do while not rst.eof%>
                <option value="<%=rst("id")%>"><%=rst("nombre")%></option>
            <%end if
        rst.movenext
        loop%>
            </select>
        <%rst.close
    set rst=nothing%>
        </div>
 

Aqui resalto la parte del onChange, esto genera una accion cuando se hace algun cambio en el select, en esta parte hay 3 partes que hay que cambiar y tener identificadas:
- cambia.asp: es un archivo que debemos generar y que sera el que haga la gestion entre la base de datos y nos imprimira los demas selects, mas adelante lo pondremos.
- select2: es un DIV en donde se mostrara el resultado de la consulta, este nombre debera ser el mismo que el DIV donde se pondra el resultado, aqui es donde podemos escoger si imprimir los demas selects desde el principio o hasta haber seleccionado el primero. Si queremos usar la segunda opcion simplemente creamos el DIV vacio:
<div id="select2"></div>

Si deseamos la segunda opcion podemos hacer lo siguiente:

Código HTML:

<div id="select2">
        <select name="select2" disabled="disabled">
            <option value=""> -- Selecciona un servicio -- </option>
        </select>
</div>
 

NOTA: deje desactivado el select por que no tiene informacion

Igual hacemos con el tercer select
<div id="select3">
<select name="select3" disabled="disabled">
<option value=""> -- Selecciona un servicio -- </option>
</select>
</div>
<img src="enviar.jpg" onClick="javascript:document.frm.submit();" />

- en=1&ser='+servicio.value, esta parte lo que genera es darle el valor a las variables que se van a enviar al archivo, en este caso cambia.asp, en este caso mandamos una variable en, que sera en el archivo cambia.asp la opcion que vamos a tomar y la parte ser nos manda el valor del select seleccionado.

Ahora vamos a ver el archivo cambia.asp:

Código asp:

<!--#include file="conexion.inc" -->
<%Response.CharSet = "ISO-8859-1"
Response.addHeader "pragma", "no-cache" 
Response.CacheControl = "Private" 
Response.Expires = 0
 
en=request("en")
 
if en=1 then 'ACTUALIZA SELECT 1
       sel2=request("ser")
        if sel2<>"" then
       Set RSt = Server.CreateObject("ADODB.Recordset")
       SQLt="Select * from TABLA WHERE id="&sel2&" order by nombre ASC"
    RSt.open sqlt, conexion%>
        <select name="select2" onchange="htmlData('cambia.asp', 'select3', 'en=2&sel2='+select2.value)">
            <option value=""> -- Selecciona una opcion -- </option>
            <%do while not rst.eof%>
                <option value="<%=rst("id")%>"><%=rst("nombre")%></option>
            <%end if
            rst.movenext
        loop%>
        </select>
        <%rst.close
    set rst=nothing%>
        <%else%>
        <select name="select2" disabled="disabled">
            <option value=""> -- Selecciona un servicio -- </option>
        </select>
        
        <%end if
 
elseif en=2 then 'ACTUALIZAR SELECT 2
 
       sel3=request("ser")
        if sel3<>"" then
       Set RSt = Server.CreateObject("ADODB.Recordset")
       SQLt="Select * from TABLA WHERE id="&sel3&" order by nombre ASC"
    RSt.open sqlt, conexion%>
        <select name="select3">
            <option value=""> -- Selecciona una opcion -- </option>
            <%do while not rst.eof%>
                <option value="<%=rst("id")%>"><%=rst("nombre")%></option>
            <%end if
            rst.movenext
        loop%>
        </select>
        <%rst.close
    set rst=nothing%>
        <%else%>
        <select name="select3" disabled="disabled">
            <option value=""> -- Selecciona un servicio -- </option>
        </select>
        
        <%end if
end if
 

NOTA: lo que nos de como resultado el archivo ASP cambia.asp sera lo que se imprima en el DIV puesto en la funcion htmlData

Se que no soy el mejor explicando pero cualquier duda estoy a sus ordenes