index.asp
Program code:
<html>
<head>
<title></title>
<meta content="text/html; charset=gb2312" http-equiv="content-type">
<style type="text/css"><!--
FONT{font-size:12px}
TD{font-size:12px}
A{color:#333399}
A:hover{color:#FF6600}
--></style>
<script language="JavaScript" type="text/JavaScript"><!--
function funOnload(){
document.all.list_file.src="jscript_city.asp?base=0&sele=0-&elem=Select01";
}
//pBase series, based on 0,
//pSele is the value of <option
//pEle is the next-level form name
function chgSelect(pBase,pSele,pElem){
//After changing a list. Clears future list values.
for(i=parseInt(pElem.replace("Select",""));i<=5;i++){
var tmp="000"+i;
var pElem1=eval("document.Form1.Select"+tmp.substr(tmp.length-2));
pElem1.length=1;
pElem1.selectedIndex=0;
}
//JS uses ASP to get the data from the database to update the subordinate list
document.all.list_file.src="jscript_city.asp?base="+pBase+"&sele="+pSele+"&elem="+pElem;
}
//--></script>
<script id="list_file" language="JavaScript" type="text/JavaScript" src=""></script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="2" text="#333333" onload="funOnload();">
<form name="Form1">
<select name="Select01" onchange="chgSelect(1,this.options[this.selectedIndex].value,'Select02')">
<option value="">Save...</option>
</select>
<select name="Select02" onchange="chgSelect(2,this.options[this.selectedIndex].value,'Select03')">
<option value="">City...</option>
</select>
<select name="Select03" onchange="chgSelect(3,this.options[this.selectedIndex].value,'Select04')">
<option value="">County...</option>
</select>
<select name="Select04" onchange="chgSelect(4,this.options[this.selectedIndex].value,'Select05')">
<option value="">Country...</option>
</select>
<select name="Select05">
<option value="">Village...</option>
</select>
</form>
</body></html>
'jscript_city.asp
Program code:
<%
' varBase drop-down menu level
' varSele database ID of the selected drop-down menu item
' varElem The next-level form name
varBase=Request.QueryString("base")
varSele=Left(Request.QueryString("sele"),InStr(Request.QueryString("sele"),"-")-1)
varElem=Request.QueryString("elem")
varDistName=""
varAutoID=""
Set conDB=Server.CreateObject("ADODB.CONNECTION")
conDB.Open "Driver={Microsoft Access Driver (*.mdb)};DBQ="&Server.Mappath("db1.mdb")
sqlCommand="select * from table1 where filed1="&varBase&" and filed2="&varSele
Set rsRecord=conDB.Execute(sqlCommand)
While Not rsRecord.eof
varDistName=varDistName&chr(34)&rsRecord("filed3")&chr(34)
varAutoID=varAutoID&chr(34)&rsRecord("id")&chr(34)
rsRecord.movenext
If Not rsRecord.Eof Then
varDistName=varDistName&","
varAutoID=varAutoID&","
End If
Wend
Response.Write("var varDistName=new Array("&varDistName&")"&vbcrlf)
Response.Write("var varAutoID=new Array("&varAutoID&")"&vbcrlf)
Response.Write("var varElem=eval("&chr(34)&"document.Form1."&varElem&chr(34)&")"&vbcrlf)
Response.Write("varElem.length=varDistName.length+1;"&vbcrlf)
Response.Write("for(var i=0;i<varDistName.length;i++){"&vbcrlf)
Response.Write(" varElem.options[i+1].text=varDistName;"&vbcrlf)
Response.Write(" varElem.options[i+1].value=varAutoID+'-'+varDistName;"&vbcrlf)
Response.Write("}"&vbcrlf)
Response.Write("varElem.selectedIndex=0;"&vbcrlf)
%>
db1.mdb
'------------------------------------------------
Huangcuo Zengcuoyu Village, Siming, Xiamen, Fujian, Shuitou Village, Xihu, Fengze, Quanzhou, Fujian.
The above five-level conversion database is:
'---------------------------------
id filed1 filed2 filed3
1 0 0 Fujian
2 1 1 Xiamen
3 1 1 Quanzhou
4 2 2 Siming
5 3 4 Huangcuo
6 4 5 Tsang Chuo Eu Village
7 2 3 Fengze
8 3 7 West Lake
9 4 8 Shuitou Village
'------------------------------------------------
Database description:
id automatic numbering
filed1 The level of the drop-down menu list (see the level. You can set its precision. It is a numeric type)
filed2 The ID number of the previous level (use long integer type)
filed3 Needless to say this (file. The length depends on the situation).
This program passed under IIS4+WIN2000P+ACCESS2000.