select联动 mysql_select二级联动，数据库动态加载

比如一个select显示所有部门，另一个select显示该部门的所有员工。

为了达到这种效果，肯定要先从数据库中取出部门，为第一个select加载选项，然后根据所选择的选项，从数据库中取出属于该部门的所有员工，为第二个select加载选项。此即所谓二级联动。多级则继续根据条件查询、加载，操作一样。

要把数据加载到网页元素很容易，因为服务器端脚本可以嵌入到客户端脚本里。如可以有如下形式：

document.myform.selectname.options[index].value=;

关键是如何把第一个select所选择的值传到第二个select，准确来说是传递参数给下一个查询语句，像的section。也就是把客户端脚本的值传到服务器脚本的变量。如果可以这样就好了：

=document.myform.selectname.options[index].value;

可惜不行。

客户端脚本要向服务器端脚本传值，只能通过网络，也就是向服务器端发送请求，并把这些值通过参数传过去。

可以在改变选项时触发表单的提交：

onChange="action='webname.jsp';target='_self';submit();"

表单将参数传回本页面，就可以用服务器脚本获取了：

问题是，页面一开始显示时，并不会触发onChange事件，也就是说所得到的section初值为空，这样第二个select一开始就不能正确显示了，而只能是用户先在第一个select中选择了其他选项，再回头选第一个选项的时候才行。

解决办法是在页面加载完成时就触发第一个select的onChange事件。

也可以定义一个变量来保存select第一个选项的值，实质是从数据库中按条件取出来的第一个值：

vector=UserDB.getSection();

initsection=vector.elementAt(0).toString();

%>

页面加载时，select还没有被onChange过，因而section为空，于是选项应该加载第一个section，也就是initsection：

另外，当两次选择同一选项时，select并没有被change，所以也不会触发onChange事件。要在这种情况下触发onChange事件，最简单的方法是在每次选择后将当前选项改回初始值：

document.all.selectname.options[0].selected=true;

这个选项(options[0])应该是用户不会选择的选项，也就是不会被change的选项，像以下这样的：

请选择

这样，每选择一次其他选项，即使重复选择同一个选项，也可以触发onChange了。