JSP+JavaScript สร้างเมนูแบบเลื่อนลงแบบเรียงซ้อนระดับที่สอง:
class (ข้อมูลคอลัมน์ระดับแรก): classId (การกำหนดหมายเลขอัตโนมัติ), className (ชื่อคอลัมน์), Nclass (ข้อมูลคอลัมน์รอง), NclassId (การกำหนดหมายเลขอัตโนมัติ), NclassName ( ชื่อคอลัมน์) , parentId (รหัสคอลัมน์ระดับแรก เชื่อมโยงกับ classId ในตารางคลาส)
<%@ หน้า contentType=text/html; charset=GB2312 language=java errorPage=../error.jsp %>
<%@ รวมไฟล์=../conn.jsp%>
<%@ รวมไฟล์=../ds.jsp%>
<%@ taglib uri=http://java.sun.com/jsp/jstl/sql divfix=sql %>
<%request.setCharacterEncoding(gb2312); %>
<HTML><HEAD>
<META http-equiv=Content-Type content=text/html; charset=gb2312>
<TITLE>เมนูแบบเรียงซ้อน</TITLE>
<LINK rel=stylesheet type=text/css href=style.css>
</HEAD>
<!--รับข้อมูลคอลัมน์รองจากฐานข้อมูล-->
<%String sql=select * จากลำดับ Nclass โดย NclassId asc;
ResultSet rs=stmt.executeQuery(sql);
-
<!--บันทึกข้อมูลคอลัมน์รองลงในอาร์เรย์ย่อย-->
<ประเภทสคริปต์=ข้อความ/จาวาสคริปต์>
var onecount;
หนึ่งนับ=0;
subcat = อาร์เรย์ใหม่ ();
-
จำนวน int = 0;
ในขณะที่(rs.ถัดไป()){
-
subcat[<%=count%>] = อาร์เรย์ใหม่(<%=rs.getString(NclassName)%>,
<%=rs.getString(NclassId)%>,<%=rs.getString(parentId)%>);
-
นับ++;
-
rs.ปิด();
-
onecount=<%=นับ%>;
<!--ฟังก์ชันที่กำหนดการเลือกการแสดงผล-->
การเปลี่ยนตำแหน่งฟังก์ชัน (locationid)
-
document.myform.NclassId.length = 0;
var locationid=locationid;
วาร์ฉัน;
สำหรับ (i=0;i < onecount; i++)
-
ถ้า (subcat [i] [2] == รหัสตำแหน่ง)
-
document.myform.NclassId.options[document.myform.NclassId.length] = ใหม่
ตัวเลือก(แมวย่อย[i][0], แมวย่อย[i][1]);
-
-
-
</script>
<รูปแบบวิธีการ=ชื่อ POST=myform action=adminsave.jsp?action=add>
<ตาราง>
<TR>
<TD>การจำแนกระดับแรก</TD>
<ทีดี>
<เลือกชื่อ=classId onChange=changelocation(document.myform.classId.options
[document.myform.classId.selectedIndex].value) ขนาด=1>
<OPTION ค่าที่เลือก>==โปรดเลือกหมวดหมู่ระดับแรก==</OPTION>
<sql:query var=query dataSource=$>
SELECT * จากคลาส
</sql:แบบสอบถาม>
<c:forEach var=row items=$>
<ค่าตัวเลือก=$>$</ตัวเลือก>
</c:สำหรับแต่ละ>
</เลือก>
</TD>
<TD>เลือกหมวดหมู่รอง</TD>
<ทีดี>
<ชื่อเลือก=NclassId>
<OPTION ค่าที่เลือก>==โปรดเลือกหมวดหมู่ระดับที่สอง==</OPTION>
</เลือก>
</TD>
</TR>
</ตาราง>
</รูปแบบ>
</ร่างกาย>
</HTML>
<%@ หน้า contentType=text/html; charset=GB2312 language=java errorPage=../error.jsp %>
<%@ รวมไฟล์=../conn.jsp%>
<%@ รวมไฟล์=../ds.jsp%>
<%@ taglib uri=http://java.sun.com/jsp/jstl/sql divfix=sql %>
<%request.setCharacterEncoding(gb2312); %>
<HTML><HEAD>
<META http-equiv=Content-Type content=text/html; charset=gb2312>
<TITLE>เมนูแบบเรียงซ้อน</TITLE>
<LINK rel=stylesheet type=text/css href=style.css>
</HEAD>
<!--รับข้อมูลคอลัมน์รองจากฐานข้อมูล-->
<%String sql=select * จากลำดับ Nclass โดย NclassId asc;
ResultSet rs=stmt.executeQuery(sql);
-
<!--บันทึกข้อมูลคอลัมน์รองลงในอาร์เรย์ย่อย-->
<ประเภทสคริปต์=ข้อความ/จาวาสคริปต์>
var onecount;
หนึ่งนับ=0;
subcat = อาร์เรย์ใหม่ ();
-
จำนวน int = 0;
ในขณะที่(rs.ถัดไป()){
-
subcat[<%=count%>] = อาร์เรย์ใหม่(<%=rs.getString(NclassName)%>,
<%=rs.getString(NclassId)%>,<%=rs.getString(parentId)%>);
-
นับ++;
-
rs.ปิด();
-
onecount=<%=นับ%>;
<!--ฟังก์ชันที่กำหนดการเลือกการแสดงผล-->
การเปลี่ยนตำแหน่งฟังก์ชัน (locationid)
-
document.myform.NclassId.length = 0;
var locationid=locationid;
วาร์ฉัน;
สำหรับ (i=0;i < onecount; i++)
-
ถ้า (subcat [i] [2] == รหัสตำแหน่ง)
-
document.myform.NclassId.options[document.myform.NclassId.length] = ใหม่
ตัวเลือก(แมวย่อย[i][0], แมวย่อย[i][1]);
-
-
-
</script>
<รูปแบบวิธีการ=ชื่อ POST=myform action=adminsave.jsp?action=add>
<ตาราง>
<TR>
<TD>การจำแนกระดับแรก</TD>
<ทีดี>
<เลือกชื่อ=classId onChange=changelocation(document.myform.classId.options
[document.myform.classId.selectedIndex].value) ขนาด=1>
<OPTION ค่าที่เลือก>==โปรดเลือกหมวดหมู่ระดับแรก==</OPTION>
<sql:query var=query dataSource=$>
SELECT * จากคลาส
</sql:แบบสอบถาม>
<c:forEach var=row items=$>
<ค่าตัวเลือก=$>$</ตัวเลือก>
</c:สำหรับแต่ละ>
</เลือก>
</TD>
<TD>เลือกหมวดหมู่รอง</TD>
<ทีดี>
<ชื่อเลือก=NclassId>
<OPTION ค่าที่เลือก>==โปรดเลือกหมวดหมู่ระดับที่สอง==</OPTION>
</เลือก>
</TD>
</TR>
</ตาราง>
</รูปแบบ>
</ร่างกาย>
</HTML>