数据库表设计
字段ClassID,ClassName,ClassType,ParentClassID
ClassID类别ID
ClassName类别名称
ClassType=1 顶级分类
ClassType=2一级分类
ClassType=3二级分类
ParentClassID父类ClassID,顶类的父类默认为0
脚本代码
<%
sql = "select * from Bs_ProductClass where ClassType=2 order by ClassID asc"
set rs = conn.execute(sql)
%>
<script language = "JavaScript">
var onecount;
onecount=0;
subcat = new Array();
<%
count1 = 0
do while not rs.eof
%>
subcat[<%=count1%>] = new Array("<%= trim(rs("ClassName"))%>","<%= trim(rs("ParentClassID"))%>","<%= trim(rs("ClassID"))%>");
<%
count1 = count1 + 1
rs.movenext
loop
rs.close
set rs=nothing
%>
onecount=<%=count1%>;
function changelocation(ClassID1)
{
document.myform.BigClassID.length = 0;
var ClassID1=ClassID1;
var i;
var op1 = document.createElement("OPTION");
document.myform.BigClassID.options[0] = new Option('==所属大类名称==',' ');
for (i=0;i < onecount; i++)
{
if (subcat[i][1] == ClassID1)
{
op1= new Option(subcat[i][0], subcat[i][2]);
document.myform.BigClassID.options.add(op1);
}
}
}
</script>
<%sql2 = "select * from Bs_ProductClass where ClassType=3 order by ClassID asc"
set rs2 = conn.execute(sql2)
%>
<script language = "JavaScript">
var onecount2;
onecount2=0;
subcat2 = new Array();
<%
count2 = 0
do while not rs2.eof
%>
subcat2[<%=count2%>] = new Array("<%= trim(rs2("ClassName"))%>","<%= trim(rs2("ParentClassID"))%>","<%= trim(rs2("ClassID"))%>");
<%
count2 = count2 + 1
rs2.movenext
loop
rs2.close
set rs2=nothing
%>
onecount2=<%=count2%>;
function changelocation2(ClassID2)
{
document.myform.SmallClassID.length = 0;
var ClassID2=ClassID2;
var j;
var op2 = document.createElement("OPTION");
document.myform.SmallClassID.options[0] = new Option('==所属小类名称==',' ');
for (j=0;j < onecount2; j++)
{
if (subcat2[j][1] == ClassID2)
{
op2 = new Option(subcat2[j][0], subcat2[j][2]);
document.myform.SmallClassID.options.add(op2);
}
}
}
</script>
调用代码
<form name='myform'>
<select name="TopClassID" id="TopClassID" onChange="changelocation(document.myform.TopClassID.options.value)" size="1">
<option selected value="">请选择所属顶类</option>
<%
sql1 = "select * from Bs_ProductClass where ClassType=1 order by ClassID asc"
set rs1 = conn.Execute (sql1)
do while not rs1.eof
%>
<option value="<%=trim(rs1("ClassID"))%>"><%=trim(rs1("ClassName"))%></option>
<%
rs1.movenext
loop
rs1.close
set rs1 = nothing
conn.Close
set conn = nothing
%>
</select>
大类
<select name="BigClassID" id="BigClassID" onChange="changelocation2(document.myform.BigClassID.options[this.options.selectedIndex].value)">
<option selected value="">==所有大类==</option>
</select>
小类
<select name="SmallClassID" id="SmallClassID" size="1">
<option selected value="">==所有小类==</option>
</select>
</form>
分享到:
相关推荐
asp省市县三级连动下拉框带数据库.现在网上的都不行,此例本人自创,决对好用!
省市县三级连动 省市县三级连动省市县三级连动JS+html 资源
js 实现三级连动,它不会影响你得运行速度 此为全国各省市的名称!
三级连动
省市三级联动JS插件,数据来源:最新县及县以上行政区划代码
JS省市区三级连动并显示所选的省市区,代码可以直接运行
最近整理阿里巴巴城市三级连动源码,希望对你有帮助,仅用于学习用途,商业用途请自行设计js程序!
ajax实现三级连动,更容易是异步处理。
这是经过测试过的省市区三级连动技术,内包含有连动需要的数据表。
js三级连动菜单(地级市省)【免费】,可以直接运行的,直接在自己的电脑上运行
Jason三级省市县连动 Jason三级省市县连动 Jason三级省市县连动 Jason三级省市县连动
dwr jsp三级连动菜单
java_swing省_市_县三级连动
使用dojo处理三级连动的简单实例,数据为在程序中写的死数据
java Ajax 3级连动 servlet
Android 省市区三级连动
2个数据库,在怎么都有一个你需要的东西.
这个实例解决了.net项目开发中的三级连动问题,用的是ajax技术,欢迎下载
省市区三级连动--spinner.zip
andorid 省市县三级连动 滚动