菜单二联动
我有两个数据表,一个存有部门,另一个存有部门,姓名
我想建立两个下拉菜单,一个显示部门,一个显示姓名,
点击选择第一个部门后第二个下拉菜单显示的是本部门的人员
有那里位大虾能帮我?
问题点数:100、回复次数:8Top
1 楼KimSoft(革命的小酒天天醉-http://blog.csdn.net/kimsoft/)回复于 2006-01-20 23:34:37 得分 35
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link href="../css/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" language="JavaScript">
<!--
function checkData(){
if (document.form1.txtUserName.value == ""){
alert("用户名不能为空!");
document.form1.txtUserName.focus();
return false;
}
if (document.form1.txtUserPWD.value == ""){
alert("密码不能为空!");
document.form1.txtUserPWD.focus();
return false;
}
return true;
}
//document.form1.selDeptName.options[document.form1.selDeptName.selectedIndex].
function changeLocation(locationid){
document.form1.txtUserName.length = 0;
for (var i=0;i < intCount; i++){
if (AryUser[i][1] == locationid){
document.form1.txtUserName.options[document.form1.txtUserName.length] = new Option(AryUser[i][0], AryUser[i][2]);
}
}
if(document.form1.txtUserName.length == 0){
document.form1.txtUserName.options[0] = new Option('请选择用户','');
}
}
//-->
</script>
</head>
<body>
<script language='JavaScript'>
<!--
var intCount=0;
AryUser = new Array();
AryUser[0] = new Array('毛艳','5','7');
AryUser[1] = new Array('张蓉','2','5');
AryUser[2] = new Array('唐晓岚','1','1');
AryUser[3] = new Array('崔华宇','1','3');
AryUser[4] = new Array('梅维德','4','14');
AryUser[5] = new Array('高月桂','5','29');
AryUser[6] = new Array('张大为','5','26');
AryUser[7] = new Array('马静','5','18');
AryUser[8] = new Array('李丹','5','30');
AryUser[9] = new Array('闵天','1','2');
AryUser[10] = new Array('梅彦川','6','16');
AryUser[11] = new Array('刘亚军','1','4');
AryUser[12] = new Array('李晫','1','24');
AryUser[13] = new Array('周增彬','13','21');
AryUser[14] = new Array('霍继亮','6','31');
AryUser[15] = new Array('赵霞','6','22');
AryUser[16] = new Array('孙喜','1','32');
intCount=17;
//-->
</script>
<form name="form1" method="post" action="login.asp" onsubmit="return checkData();">
<table width="683" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="100" colspan="5"> </td>
</tr>
<tr>
<td rowspan="5"> </td>
<td rowspan="5"><img src="../images/login/main_04.gif" width="6" height="265" alt=""></td>
<td rowspan="3"><img src="../images/login/main_05.gif" width="1" height="212" alt=""></td>
<td><img src="../images/login/main_06.gif" width="683" height="19" alt=""></td>
<td rowspan="5"><img src="../images/login/main_07.gif" width="6" height="265" alt=""></td>
</tr>
<tr>
<td><img src="../images/login/main_08.gif" width="683" height="178" alt=""></td>
</tr>
<tr>
<td><img src="../images/login/main_09.gif" width="683" height="15" alt=""></td>
</tr>
<tr>
<td height="31" colspan="2" bgcolor="#A3B9CC">
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="60" align="right"> 部门:</td>
<td width="120">
<!--Sub CreateSelList() Written by KIM-->
<select name='selDeptName' id='selDeptName' onChange='changeLocation(document.form1.selDeptName.options[document.form1.selDeptName.selectedIndex].value)'>
<option value=''>---------请选择部门---------</option>
<option value='1'>投资促进事务局</option>
<option value='2'>北京万方数据股份有限公司</option>
<option value='4'>中投网技术维护组</option>
<option value='5'>中投网栏目维护组</option>
<option value='6'>中国开发区协会</option>
<option value='13'>翻译包</option>
</select>
</td>
<td width="60" align="right">用户名:</td>
<td width="100">
<select name="txtUserName" id="txtUserName">
<option>请选择用户</option>
</select>
</td>
<td width="40" align="right">密码:</td>
<td width="100"><input name="txtUserPwd" type="password" id="txtUserPWD" size="12" maxlength="12">
</td>
<td width="40"><input type="submit" name="Submit" value="登录">
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2"><img src="../images/login/main_11.gif" width="684" height="22" alt=""></td>
</tr>
</table>
</form>
</body>
</html>
存为html看看效果.Top
2 楼chouchy(城市刀客)回复于 2006-01-20 23:52:07 得分 35
从数据库中查询出部门和人员,保存到javascript数组中,如下所示:
<script language="javascript">
var depart=new Array("部门1","部门2","部门3","部门4");
var employee=new Array(["11","12"],["21","22","23","24","25","26"],["31","32","33"],["41","42","43","44"]);
function chgSelect(idx)
{
if(idx>0)
{
var s,opt;
s = document.all.employee;
//如果前面已经添加了option,则清除前面添加的option;
if(s.length>1)
{
var len=s.options.length;
for(i=0;i<len;i++)
s.options.remove(1);
}
//追加新的option;
for(j=0;j<employee[idx-1].length;j++)
{
opt = document.createElement("OPTION");
opt.text=opt.value=employee[idx-1][j];
s.add(opt);
}
}
}
</script>
<select name="depart" onchange="chgSelect(this.selectedIndex)">
<option>请选择部门</option>
<script language="javascript">
for(i=0;i<depart.length;i++)
{
document.write("<option value='"+depart[i]+"'>"+depart[i]+"</option>");
}
</script>
</select>
<select name="employee">
<option>请选择人员</option>
</select>Top
3 楼heart_shen(沈)回复于 2006-01-21 00:06:43 得分 0
如何把两个表中部门和姓名数据转化为数组?
Top
4 楼zhanghongwen(流氓蚊子)回复于 2006-01-21 10:13:53 得分 10
<form name="form1" method="post" action="" style=MARGIN-BOTTOM:0px>
<br>
<table width="100%" border="0" align="center">
<tr>
<td><span class="style5">请选择查询类别:一级父类:
<select name="fl1" class="textboxLINE_1" id="fl1" onChange="document.form1.submit();">
<%
set rs2=server.CreateObject("ADODB.Recordset")
set conn2=server.createobject("adodb.connection")
connstr2="DSN=gsj;uid=sa;pwd=sa;database=qjgsj_data"
conn2.open connstr2
sql2="select * from leibie"
rs2.open sql2,conn2,1,1
%>
<option><%=request.form("fl1")%>
<% Do until rs2.EOF %>
<option><%=rs2("lbmc")%></option>
<%
rs2.movenext
loop
%>
</select>
二级父类:
<select name="fl2" class="textboxLINE_1" id="fl2" onChange="document.form1.submit();">
<%
set rs3=server.CreateObject("ADODB.Recordset")
set conn3=server.createobject("adodb.connection")
connstr3="DSN=gsj;uid=sa;pwd=sa;database=qjgsj_data"
conn3.open connstr3
sql3="select * from zbiao1 where ssfl='"&request.form("fl1")&"'"
rs3.open sql3,conn3,1,1
%>
<option><%=request.form("fl2")%>
<% Do until rs3.EOF %>
<option><%=rs3("lbmc1")%></option>
<%
rs3.movenext
loop
%>
</select>
三级父类:
<select name="fl3" class="textboxLINE_1" id="fl3" onChange="document.form1.submit();">
<%
set rs4=server.CreateObject("ADODB.Recordset")
set conn4=server.createobject("adodb.connection")
connstr4="DSN=gsj;uid=sa;pwd=sa;database=qjgsj_data"
conn4.open connstr4
sql4="select * from zbiao2 where yjfl='"&request("fl1")&"' and rjfl='"&request("fl2")&"'"
rs4.open sql4,conn4,1,1
%>
<option><%=request.form("fl3")%>
<% Do until rs4.EOF %>
<option><%=rs4("lbmc2")%></option>
<%
rs4.movenext
loop
%>
</select>
四级父类:
<select name="fl4" class="textboxLINE_1" id="fl4">
<%
set rs5=server.CreateObject("ADODB.Recordset")
set conn5=server.createobject("adodb.connection")
connstr5="DSN=gsj;uid=sa;pwd=sa;database=qjgsj_data"
conn5.open connstr5
sql5="select * from zbiao3 where yjfl='"&request("fl1")&"' and rjfl='"&request("fl2")&"' and sjfl='"&request("fl3")&"'"
rs5.open sql5,conn5,1,1
%>
<% Do until rs5.EOF %>
<option><%=rs5("lbmc3")%></option>
<%
rs5.movenext
loop
%>
<option></option>
</select>
把第一个跳转菜单的值到第二个,参考一下.Top
5 楼danis_cn(宇宙鸟)回复于 2006-01-21 10:16:31 得分 10
参考下:
<%'
set rs=server.CreateObject("adodb.recordset")
sql="select * from classname,smallclassname where classname.id=smallclassname.classid "
rs.open sql,conn,1,3%>
<script language="javascript">
<%if rs.eof then%>
function change_1(thisvalue){
document.form1.select2.length=0
document.form1.select2.options[0]=new Option("此大类暂时没有小类","无");
}
<%else%>
var shuzi,panduan
shuzi=0
panduan=0
var shu=new Array()
<%for i=0 to rs.recordcount-1%>
shu[<%=i%>]=new Array("<%=rs("smallclassname")%>","<%=rs("smallclassname")%>","<%=rs("classname")%>");
shuzi=shuzi+1
<% rs.movenext
next%>
function change_1(thisvalue){
if(thisvalue==0)
{document.form1.select2.length=0;
document.form1.select2.options[0]=new Option("---请选择---","0");
return;}
panduan=0
document.form1.select2.length=0;
for(i=0;i<=shuzi-1;i++){
if(shu[i][2]==thisvalue){
document.form1.select2.options[document.form1.select2.length]=new Option(shu[i][0],shu[i][1]);
//document.form1.select3.value=shu[i][2];
panduan=panduan+1;
}
}
if(panduan!=0)
{document.form1.select2.options[document.form1.select2.length-1].selected=true;}
else{document.form1.select2.length=0;
document.form1.select2.options[0]=new Option("此大类暂时没有小类","无");}
}
<%end if%>
<select name=select1 onChange=change_1(this.options[this.selectedIndex].value) >
<option value=0>---请选择---</option>
<%set sr=server.CreateObject("adodb.recordset")
sr.open "select classname from classname order by orderid desc",conn,1,3
while not sr.eof %>
<option value="<%=sr("classname")%>"><%=sr("classname")%></option>
<% sr.movenext
wend %>
</select>
<select name=select2>
<option value=0>---请选择---</option>
</select>
Top
6 楼chouchy(城市刀客)回复于 2006-01-21 11:09:02 得分 0
“如何把两个表中部门和姓名数据转化为数组?”
------------------------------------------------------------------
<script language="javascript">
var depart=new Array();
var employee=new Array();
var temp=new Array();
<%
'rs:select 部门 from 部门表;
'while not rs.eof
%>
depart.push(rs("部门"));
<%
'rs2:select 员工 from 员工表 where 部门=rs("部门");
'while not rs2.eof
%>
temp.push(rs2("员工"));
<%
'rs2.moveNext
'wend
'rs.moveNext
'wend
%>
for(i=0;i<temp.length;i++)
{
employee.push(temp[i]);
}
//至此,两个表中部门和姓名数据转化成数组
</script>Top
7 楼chouchy(城市刀客)回复于 2006-01-21 11:28:14 得分 0
对不起,上面说错了,employee应该是个二维数组,结果被我弄成一维的了,修改如下:
<script language="javascript">
var depart=new Array();
var employee=new Array();
var i=0;
<%
'rs:select 部门 from 部门表;
'while not rs.eof
%>
depart.push(rs("部门"));
<%
'rs2:select 员工 from 员工表 where 部门=rs("部门");
'while not rs2.eof
%>
temp[i].push(rs2("员工"));
<%
'rs2.moveNext
'wend
%>
i++;
<%>
'rs.moveNext
'wend
%>
for(i=0;i<temp.length;i++)
{
employee.push(temp[i]);
}
//至此,数组转化完成
</script>Top
8 楼adleyliu(留印)回复于 2006-01-21 15:05:27 得分 10
function select1(i){
for (n=document.shjiainfo.city.options.length-1;n>0;n--)
{
document.shjiainfo.city.options[n]=null
}
for (n=document.shjiainfo.zone.options.length-1;n>0;n--)
{
document.shjiainfo.zone.options[n]=null
}
var m=1;
document.shjiainfo.city.options[0]=new Option("请选择市","");
document.shjiainfo.zone.options[0]=new Option("请选择区","");
//以上初始化菜单 以下读数据
<%
set rs1=server.createobject("adodb.recordset")
rs1.open "select * from city",conn,1,1
while not(rs1.eof or rs1.bof)
response.Write("if (i=="""& rs1("province")&""")")
response.Write("{document.shjiainfo.city.options[m]=new Option("""&rs1("city")&""","""&rs1("city")&""");")
response.Write("m=m+1;}")
rs1.movenext
wend
rs1.close
%>
document.shjiainfo.city.options[0].selected=true //第一行为默认选择
}
function select2(i){
for (n=document.shjiainfo.zone.options.length-1;n>0;n--)
{
document.shjiainfo.zone.options[n]=null
}
var m=1;
document.shjiainfo.zone.options[0]=new Option("请选择区","");
<%
rs1.open "select * from [zone]",conn,1,1
while not(rs1.eof or rs1.bof)
response.Write("if (i=="""& rs1("city")&""")")
response.Write("{document.shjiainfo.zone.options[m]=new Option("""&rs1("zone")&""","""&rs1("zone")&""");")
response.Write("m=m+1;}")
rs1.movenext
wend
rs1.close
%>
document.shjiainfo.zone.options[0].selected=true
}
详细参见:http://www.115000.com.cn/
有演示Top




