下拉框动态对应问题
我想做一个部门和员工的动态对应的两个下拉框，选中第一个部门，第二个下拉框里所有属于这个部门的员工全部显示出来，要不刷新的，最好给出代码 ，谢谢！
[解决办法]
先全部从数据库取出存入数组
<script LANGUAGE=JavaScript>
<!--
var name=new Array();
<%
for(int i=0;i <parrStsUserList.size();i++)
{
pobjCp = (Cp)parrStsUserList.get(i);
out.println( "name[ "+i+ "]=new Array( ' "+pobjCp.getCpID()+ " ', ' "+pobjCp.getCpname()+ " ', ' "+pobjCp.getCpuseid()+ " '); ");
}
%>
-->
</script>
getCpID是ID，getCpname是名字（王小二），getCpuseid是他的部门ID
<script LANGUAGE=JavaScript>
<!--
function onChange(dep)
{
ln = Form.name.options.length;
while(ln--) {
Form.name.options[ln] = null;//清空员工姓名的select的值
}
for(i=0;i <name.length;i++)
{
if(name[i][2]==dep)//如果name[i][2]部门ID等于dep时
{
Form.name.add(new Option(name[i][0],name[i][1]));//就给员工姓名的select增加一个option,name[i][0],name[i][1]这两个的位置你自己试试
}
}
}
-->
</script>
<form name=Form type=post>
<select name= "dep " onchange= "onChange(this.value) "> //当值改变时就执行函数
<option value= "部门ID "> 部门名 </option> //中间的option是从数据库读出生成的
</select>
<select name= "name ">
<option value= "0 "> 请先选择部门 </option>
</select>
</form>
[解决办法]
这中问题比较简单，最常见的有日期下拉，中国省份/城市/县下拉联动，我给你一个列子，希望对你有所帮助：
在JavaScript中写如下，我用的是struts，别的原理一样都是先查出来放到多维数组里，然后通过下拉，拉筛选出后面下拉框要显示的数组，予以显示
===================================================================================
//省份-市级联动Bean取得
<bean:define id= "placeKb12List " name= "outputBean " property= "placeKb12Bean " type= "java.util.ArrayList " />
<bean:size id= "size " name= "placeKb12List " />
var arrPlaceKb12List=new Array( <bean:write name= "size "/> );
//省份-市级-县市联动Bean取得
<bean:define id= "placeKb123List " name= "outputBean " property= "placeKb123Bean " type= "java.util.ArrayList " />
<bean:size id= "size1 " name= "placeKb123List " />
var arrPlaceKb123List=new Array( <bean:write name= "size1 "/> );
var i; //循环使用
//省份-市级联动2维数组
for (i=0; i <arrPlaceKb12List.length; i++) {
arrPlaceKb12List[i]=new Array(1);
}
<logic:iterate id= "item " name= "placeKb12List " indexId= "index ">
arrPlaceKb12List[ <bean:write name= "index " /> ][0]= " <bean:write name= "item " property= "placeKb1 " /> ";
arrPlaceKb12List[ <bean:write name= "index " /> ][1]= " <bean:write name= "item " property= "placeKb2 " /> ";
arrPlaceKb12List[ <bean:write name= "index " /> ][2]= " <bean:write name= "item " property= "placeKb2Name " /> ";
</logic:iterate>
//省份-市级-县市联动2维数组
for (i=0; i <arrPlaceKb123List.length; i++) {
arrPlaceKb123List[i]=new Array(1);
}
<logic:iterate id= "item1 " name= "placeKb123List " indexId= "index ">
arrPlaceKb123List[ <bean:write name= "index " /> ][0]= " <bean:write name= "item1 " property= "placeKb1 " /> ";
arrPlaceKb123List[ <bean:write name= "index " /> ][1]= " <bean:write name= "item1 " property= "placeKb2 " /> ";
arrPlaceKb123List[ <bean:write name= "index " /> ][2]= " <bean:write name= "item1 " property= "placeKb3 " /> ";
arrPlaceKb123List[ <bean:write name= "index " /> ][3]= " <bean:write name= "item1 " property= "placeKb3Name " /> ";
</logic:iterate>
//===============================================================================================
function setPlace(t){
var elem1=document.forms[0].placeKb1;
var elem2=document.forms[0].placeKb2;
var elem3=document.forms[0].placeKb3;
var elem2Value=elem2.value;
var elem3Value=elem3.value;
var i;
var j;
if (t=1) {
//有第1个下拉的值,确定第2个下拉列表
elem2.length = 1; //清空下拉列表
j=0;
for (i=0; i <arrPlaceKb12List.length; i++) {
if (elem1.value==arrPlaceKb12List[i][0] || elem1.value== " ") {
//方法1
//elem2.options.add(new Option(arrPlaceKb12List[i][2], arrPlaceKb12List[i][1]));
//方法2
j++;
elem2.options[j] = new Option(arrPlaceKb12List[i][2]);
elem2.options[j].value = arrPlaceKb12List[i][1];
}
}
//选定先前elem2的值,如果相应下拉框没有此值，则flag位为1
var elem2Flag=1;
elem2.value = " ";
for (i=0; i <elem2.length; i++) { //或者用elem2.options.length
if (elem2.options[i].value == elem2Value) elem2Flag = 0;
}
if (elem2Flag == 0) elem2.value = elem2Value;
}
//有第2个下拉的值,确定第3个下拉列表
elem3.length = 1; //清空下拉列表
j=0;
for (i=0; i <arrPlaceKb123List.length; i++) {
if ((elem1.value==arrPlaceKb123List[i][0] && elem2.value==arrPlaceKb123List[i][1] )|| (elem1.value== " " && elem2.value== " ")) {
j++;
elem3.options[j] = new Option(arrPlaceKb123List[i][3]);
elem3.options[j].value = arrPlaceKb123List[i][2];
}
}
//选定先前elem3的值,如果相应下拉框没有此值，则flag位为1
var elem3Flag=1;
elem3.value = " ";
for (i=0; i <elem3.length; i++) { //或者用elem3.options.length
if (elem3.options[i].value == elem3Value) elem3Flag = 0;
}
if (elem3Flag == 0) elem3.value = elem3Value;
}
===============================================================================
对应的JSP中写：
-------------------------------------------
<TR>
<TD>
<bean:define id= "placeKb1List " name= "outputBean " property= "placeKb1Bean " type= "java.util.ArrayList " />
<html:select property= "placeKb1 " onchange= "setPlace(1) ">
<html:options collection= "placeKb1List " property= "placeKb1 " labelProperty= "placeKb1Name " />
</html:select>
</TD>
<TD> 省 </TD>
<TD>
<bean:define id= "placeKb2List " name= "outputBean " property= "placeKb2Bean " type= "java.util.ArrayList " />
<html:select property= "placeKb2 " onchange= "setPlace(2) ">
<html:options collection= "placeKb2List " property= "value " labelProperty= "label " />
</html:select>
</TD>
<TD> 市 </TD>
<TD>
<bean:define id= "placeKb3List " name= "outputBean " property= "placeKb3Bean " type= "java.util.ArrayList " />
<html:select property= "placeKb3 ">
<html:options collection= "placeKb3List " property= "value " labelProperty= "label " />
</html:select>
</TD>
<TD> 县 </TD>
</TR>
=============================================================================
具体实现的方法是全部查出来放到数组中，然后通过选择第一/个下拉，触发setPlace JS函数，同样选择第二个也会触发setPlace JS函数。
