Combo-box enlazados con datos de una B.D


http://www.asptutor.com

Combo-box enlazados con datos de una B.D. 

Nuestro amigo Tronxo (http://www24.brinkster.com/tronxo/) nos envía un interesante ejemplo de como hacer dos combo-box enlazados (cuando se actualiza uno, se actualiza el otro) con los datos extraídos de una base de datos.

Esta programado con asp y JavaScript y puede ser extremadamente útil para el desarrollo de catálogos de productos, formularios a rellenar, etc.

Basándonos en este desarrollo hemos construido un catalogo de productos de una hipotética tienda de Hardware, que podéis ver pulsando AQUÍ, podéis descargar el código completo del ejemplo de catalogo virtual en la sección de descargas

 

He modificado un poco el ejemplo para hacerlo mas comprensible a todos

<html>

<head>
<title>Combos combinados</title>

<script language = "JavaScript">



<%'CONSULTA PARA OBTENER LOS DATOS
Set Conn = Server.CreateObject("ADODB.Connection")
Conn.Open("DRIVER={Microsoft Access Driver (*.mdb)}; DBQ=" & Server.MapPath("\database\hard.mdb"))

productos_Sql = "Select distinct familia, codigo, denominacion from articulos "
set rs = CreateObject("ADODB.Recordset")
rs.Open productos_Sql, Conn
x=0
%>

// FUNCION DE COMBO BOX COMBINADO

function sublist(inform, selecteditem)
{
inform.subcatagory.length = 0

<%
count= 0
y=0
do while not rs.eof
%>

x = <%= trim(y) %>;

subcat = new Array();
subcatagorys = "<%=(rs("codigo"))&" "&(rs("denominacion")) %>";
subcatagoryof = "<%=(rs("familia"))%>";
subcatagoryid = "<%=(rs("codigo"))%>";
subcat[x,0] = subcatagorys;
subcat[x,1] = subcatagoryof;
subcat[x,2] = subcatagoryid;
if (subcat[x,1] == selecteditem) {
var option<%= trim(count) %> = new Option(subcat[x,0], subcat[x,2]);
inform.subcatagory.options[inform.subcatagory.length]=option<%= trim(count)%>;
}
<%
count = count + 1
y = y + 1
rs.movenext
loop
rs.close
%>
}

</script>



</head>

<body bgcolor="#CDB1B7">
<h2 align="center"><b><i><font color="#AE1732"><u>Combo-box enlazados </u></font></i></b></h2>
<form name="prueba">
<div align="center">
<center>
<table border="0" width="80%">
<tr>

<td width="77%">
<select size="1" id="familia" name="familia" onChange = "javascript:sublist(this.form, familia.value);">

<option selected>Selecciona una familia</option>
<%familias_Sql = "Select distinct id,familia from familias"
rs.Open familias_Sql, Conn
do while not rs.eof
%>
<option value="<%=rs("id")%>"><%=rs("familia")%></option>


<%rs.movenext
loop
set rs=nothing
conn.close
set conn=nothing%>
</select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SELECT id="subcatagory" name="subcatagory" size="1">
<Option selected value="none"></option>
</SELECT></td>
<td width="9%">
<p align="left">

</p>

</td>
</tr>
</table>
</center>
</div>
<center>
</form>
</center>
</body>
</html>