Based on asp+ajax and database driven secondary linkage menu

  • 2020-03-31 20:41:53
  • OfStack

Index. Asp page code
 
<!--#include file="conn.asp" --> 
<% 
set cmd = conn.execute("select bigclassid,bigclassname from bigclass") 
tempid=cmd("bigclassid") 
%> 
<select name="menu" onChange="getsubcategory(this.value);"> 

<% 
if not cmd.eof then 
do while not cmd.eof 
bigclassid= cmd("bigclassid") 
bigclassname = cmd("bigclassname") 
%> 
<option value="<%=bigclassid%>"><%=bigclassname%></option> 
<% 
cmd.movenext 
loop 
end if 
cmd.close 
set cmd = nothing 
%> 
</select> 
<div id="subclass"> 
<select name="submenu"> 

<% 
set cxd = conn.execute("select * from smallclass where bigclassid=" & tempid) 
if not cxd.eof then 
do while not cxd.eof 
smallclassid= cxd("smallclassid") 
smallclassname = cxd("smallclassname")%> 
<option value="<%=smallclassid%>"><%=smallclassname%></option> 
<% 
cxd.movenext 
loop 
cxd.close 
set cxd = nothing 
else 
html = "<select name='smallclassid'><option value='0' selected> No small classes </option></select>" 
response.write html 
end if 
%> 
</select> 
</div> 

Ajax. Js code
 
// JavaScript Document 
function createxmlhttp() 
{ 
xmlhttpobj = false; 
try{ 
xmlhttpobj = new XMLHttpRequest; 
}catch(e){ 
try{ 
xmlhttpobj=new ActiveXObject("MSXML2.XMLHTTP"); 
}catch(e2){ 
try{ 
xmlhttpobj=new ActiveXObject("Microsoft.XMLHTTP"); 
}catch(e3){ 
xmlhttpobj = false; 
} 
} 
} 
return xmlhttpobj; 
} 

function getsubcategory(bigclassid){ 
if(bigclassid==0){ 
document.getElementById("subclass").innerHTML="<select name='smallclassid'><option value='0' selected> Selective secondary classification </option></select>"; 
return; 
}; 
var xmlhttpobj = createxmlhttp(); 
if(xmlhttpobj){//If the object xmlhttpobj is created successfully
xmlhttpobj.onreadystatechange=handle; 
xmlhttpobj.open('get',"getsubcategory.asp?bigclassid="+bigclassid+"&number="+Math.random(),true);//The get method adds a random number.


xmlhttpobj.send(null); 
} 
} 

function handle(){//Client monitoring functions
//if(xmlhttpobj.readystate==4){// The server processed the request  
if(xmlhttpobj.status==200){ 
//alert('ok'); 
var html = xmlhttpobj.responseText;//Get the return value
document.getElementById("subclass").innerHTML=html; 
}else{ 
document.getElementById("subclass").innerHTML=" Sorry, there is something wrong with the page you requested ..."; 
} 
//} 
//else{ 
//document.getElementById("subclass").innerHTML=xmlhttpobj.readystate;// Server processing  
//} 
//} 

} 

Getsubcategory. Asp code
 
<%@language="vbscript" codepage="936"%> 
<!--#include file="conn.asp"--> 
<% 
response.charset="gb2312" 
bigclassid=safe(request.querystring("bigclassid")) 
if bigclassid<>"" then 
set re=new regexp 
re.ignorecase=true 
re.global=false 
re.pattern = "^[0-9]{1,3}$" 
if not re.test(bigclassid) then 
response.write " Illegal parameter " 
response.end 
end if%> 

<%on error resume next 
set p = conn.execute("select * from smallclass where bigclassid=" & bigclassid) 
if err then 
err.clear 
response.write " Query error " 
response.end 
end if 
if not p.eof then 
html = "<select name='select2'>"&vbnewline 
do while not p.eof 
html = html&"<option value='"&p("smallclassid")&"'>"&p("smallclassname")&"</option>"&vbnewline 
p.movenext 
loop 
html = html&"</select>" 
else 
html = "<select name='smallclassid'><option value='0' selected> No small classes </option></select>" 
end if 
p.close 
set p = nothing 
conn.close 
set conn = nothing 
response.write html 
html = "" 
end if 
%> 

Related articles: