| heprox 2004-02-24, 8:28 pm |
| I have an ASP page using Javascript to dynamically populate three list boxes at
the client side with arrays. I used the tutorial on Macromedia's website but
can only get one of my list boxes to work correctly. Whenever you choose the
first list box it updates the second one, however when you select the second
one it DOES NOT update the third. The values for the third ARE being passed to
the client-side however because you can view them in the source. Is there a
limitation to the number of items that can be displayed in a listbox? Here is
my code:
<%@LANGUAGE="JAVASCRIPT" CODEPAGE="1252"%>
<!--#include file="Connections/database.asp" -->
<%
var division_lookup = Server.CreateObject("ADODB.Recordset");
division_lookup.ActiveConnection = MM_database_STRING;
division_lookup.Source = "SELECT div_cd, des FROM div WHERE div_cd not in
('T','8','D','E','F','G') ORDER BY div_cd";
division_lookup.CursorType = 0;
division_lookup.CursorLocation = 2;
division_lookup.LockType = 1;
division_lookup.Open();
var division_lookup_numRows = 0;
%>
<%
var department_lookup = Server.CreateObject("ADODB.Recordset");
department_lookup.ActiveConnection = MM_database_STRING;
department_lookup.Source = "SELECT div_cd, dept_cd, des FROM dept WHERE div_cd
not in ('T','8','D','E','F','G') AND des <> 'DO NOT USE' ORDER BY dept_cd";
department_lookup.CursorType = 0;
department_lookup.CursorLocation = 2;
department_lookup.LockType = 1;
department_lookup.Open();
var department_lookup_numRows = 0;
%>
<%
var class_lookup = Server.CreateObject("ADODB.Recordset");
class_lookup.ActiveConnection = MM_database_STRING;
class_lookup.Source = "SELECT dept_cd, class_cd, des FROM class WHERE div_cd
not in ('T','8','D','E','F','G') AND des <> 'DO NOT USE' ORDER BY class_cd";
class_lookup.CursorType = 0;
class_lookup.CursorLocation = 2;
class_lookup.LockType = 1;
class_lookup.Open();
var class_lookup_numRows = 0;
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Merchandise Hiearchy Search</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
var arrDynaList = new Array();
var arrDL1 = new Array();
arrDL1[1] = "selList1"; // Name of parent list box
arrDL1[2] = "form1"; // Name of form containing parent list box
arrDL1[3] = "selList2"; // Name of child list box
arrDL1[4] = "form2"; // Name of form containing child list box
arrDL1[5] = arrDynaList;
<%
var txtDynaListRelation, txtDynaListLabel, txtDynaListValue, oDynaListRS;
txtDynaListRelation = "DIV_CD" // Name of recordset field relating to parent
txtDynaListLabel = "DES" // Name of recordset field for child Item Label
txtDynaListValue = "DIV_CD" // Name of recordset field for child Value
oDynaListRS = department_lookup // Name of child list box recordset
var varDynaList = -1;
var varMaxWidth = "1";
var varCheckGroup = oDynaListRS.Fields.Item(txtDynaListRelation).Value;
var varCheckLength = 0;
var varMaxLength = 0;
while (!oDynaListRS.EOF){
if (varCheckGroup != oDynaListRS.Fields.Item(txtDynaListRelation).Value) {
varMaxLength = Math.max(varCheckLength, varMaxLength)
varCheckLength = 0;
}
%>
arrDynaList[<%=(varDynaList+1)%>] =
"<%=(oDynaListRS.Fields.Item(txtDynaListRelation).Value)%>";
arrDynaList[<%=(varDynaList+2)%>] =
"<%=(oDynaListRS.Fields.Item(txtDynaListLabel).Value)%>";
arrDynaList[<%=(varDynaList+3)%>] =
"<%=(oDynaListRS.Fields.Item(txtDynaListValue).Value)%>";
<%
if (oDynaListRS.Fields.Item(txtDynaListLabel).Value.length >
varMaxWidth.length) {
varMaxWidth = oDynaListRS.Fields.Item(txtDynaListLabel).Value;
}
varCheckLength = varCheckLength + 1;
varDynaList = varDynaList + 3;
oDynaListRS.MoveNext();
}
varMaxLength = Math.max(varCheckLength, varMaxLength)
%>
var arrDynaList2 = new Array();
var arrDL2 = new Array();
arrDL2[1] = "selList2"; // Name of parent list box
arrDL2[2] = "form2"; // Name of form containing parent list box
arrDL2[3] = "selList3"; // Name of child list box
arrDL2[4] = "form3"; // Name of form containing child list box
arrDL2[5] = arrDynaList2;
<%
var txtDynaListRelation2, txtDynaListLabel2, txtDynaListValue2, oDynaListRS2;
txtDynaListRelation2 = "DEPT_CD" // Name of recordset field relating to parent
txtDynaListLabel2 = "DES" // Name of recordset field for child Item Label
txtDynaListValue2 = "DEPT_CD" // Name of recordset field for child Value
oDynaListRS2 = class_lookup // Name of child list box recordset
var varDynaList2 = -1;
var varMaxWidth = "1";
var varCheckGroup = oDynaListRS2.Fields.Item(txtDynaListRelation2).Value;
var varCheckLength = 0;
var varMaxLength = 0;
while (!oDynaListRS2.EOF){
if (varCheckGroup != oDynaListRS2.Fields.Item(txtDynaListRelation2).Value) {
varMaxLength = Math.max(varCheckLength, varMaxLength)
varCheckLength = 0;
}
%>
arrDynaList2[<%=(varDynaList2+1)%>] =
"<%=(oDynaListRS2.Fields.Item(txtDynaListRelation2).Value)%>";
arrDynaList2[<%=(varDynaList2+2)%>] =
"<%=(oDynaListRS2.Fields.Item(txtDynaListLabel2).Value)%>";
arrDynaList2[<%=(varDynaList2+3)%>] =
"<%=(oDynaListRS2.Fields.Item(txtDynaListValue2).Value)%>";
<%
if (oDynaListRS2.Fields.Item(txtDynaListLabel2).Value.length >
varMaxWidth.length) {
varMaxWidth = oDynaListRS2.Fields.Item(txtDynaListLabel2).Value;
}
varCheckLength = varCheckLength + 1;
varDynaList2 = varDynaList2 + 3;
oDynaListRS2.MoveNext();
}
varMaxLength = Math.max(varCheckLength, varMaxLength)
%>
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 = null;
}
oList.selectedIndex = -1;
}
function populateDynaList(oList, nIndex, aArray){
oList[oList.length]= new Option("Please Select");
for (var i = 0; i < aArray.length; i= i + 3){
if (aArray == 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;
}
function MM_callJS(jsStr) { //v2.0
return eval(jsStr)
}
//-->
</script>
</head>
<body onLoad=" MM_callJS('setDynaList(arrDL1);setDynaList(arrDL2)
')">
<table width="500" border="0">
<tr>
<td colspan="3">Merchandise Hiearchy Search </td>
</tr>
<tr>
<td width="148">Division:</td>
<td width="169">Department:</td>
<td width="169">Class:</td>
</tr>
<tr>
<td><form name="form1" method="post" action="">
<select name="selList1" size="10" id="selList1" onChange="
MM_callJS('setDynaList(arrDL1);setDynaList(arrDL2)
')">
<%
while (!division_lookup.EOF) {
%>
<option
value="<%=(division_lookup.Fields.Item("DIV_CD").Value)%>"><%=(division_lookup.F
ields.Item("DES").Value)%></option>
<%
division_lookup.MoveNext();
}
if (division_lookup.CursorType > 0) {
if (!division_lookup.BOF) division_lookup.MoveFirst();
} else {
division_lookup.Requery();
}
%>
</select>
</form></td>
<td><form name="form2" method="get" action="">
<select name="selList2" size="10" id="selList2"
onChange="MM_callJS('setDynaList(arrDL2)')">
</select>
</form></td>
<td><form name="form3" method="get" action="">
<select name="selList3" size="10" id="selList3">
</select>
</form></td>
</tr>
</table>
</body>
</html>
<%
division_lookup.Close();
%>
<%
department_lookup.Close();
%>
<%
class_lookup.Close();
%>
|