标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
) k) V3 b# s- ~& P
c pageencoding="gb2312"
# M* @* ~3 O- s
%>
% [2 @% H3 Q/ ^2 y' R( B
<style>
, ~& m! P* ~5 X1 E7 S& h; u7 z# D# J
.f9{ font-size:9pt; }
+ p/ Y+ R) B* u7 L* S* S% a
.bgc{ background-color:#aecaf9; color: #0033ff }
% z+ Y0 c$ o2 _1 x: o3 U
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
( d/ u5 V% H1 V) ] s/ `# |) U
border-bottom: solid 1px #4e7dc1;
, ?8 r8 o5 }# Q4 g
border-left: solid 1px #aecaf9;
+ L+ X2 k. a) ?: M
border-right: solid 1px #5679bd;
! P9 S5 J( H: P& S5 C0 ~
padding:1px;
( u5 _4 ]: W2 H9 }1 A1 i( y
margin:0px;}
9 R3 p2 I& P) q
</style>
- J; k1 ], t$ g, I( d" i
<script language="javascript">
# h3 D- y9 W+ \2 v: B B
<!--
3 E$ X3 g2 y+ R
function rv()
1 d3 ~3 I9 i' S* c% J/ t- z/ _
{
5 `- o. w8 Z$ |
var val="";
6 u- b/ J0 r) Z) _9 L# o+ Q3 ]
for(i=0;i<combo_box.list2.length;i++){
4 b; S+ d& j3 b( r2 ` q% t
val+=","+combo_box.list2
.value;
2 y' D( a2 \3 u9 N5 K: L7 L
}
% B# b0 d( R" c0 m0 l
if(val.charat(0)==","){
, l+ k: m$ y; f
val=val.substr(1,val.length);
, S, i$ r M# y0 p `) B$ S
}
4 i1 f5 r( z4 X3 R7 S. p) T; Z: l
opener.form1.frecname.value=val;
2 g% q/ D9 y/ Y W* X
self.close();
' B& j ~: `7 I8 B6 l& }3 _
}
2 `: h2 Q7 ~4 o5 z9 C
//-->
" g* h) ]/ t' r
</script>
9 _" A0 q5 |" S& m
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
! ?/ P6 u+ e9 v6 k x( _
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
. S3 s$ T* c, P
<%
+ d# M# q9 J0 z9 ^& F
cdatasource ds=new cdatasource(); //数据联结bean实例
- V8 A4 l2 L" I! ^% s
java.sql.connection conn=ds.getconnection();
+ I- C0 B3 p6 S6 ?
java.sql.statement stmt=null;
) p8 _4 ^0 U k) P( F
java.sql.resultset rs=null;
1 n9 F0 A+ G( A# x! b6 l
cdatacheck dc=new cdatacheck();
* E4 M: a- A" Y% S' y- c4 A( t
%>
) ]. q# R4 Q6 i( A+ U
<%
+ f+ n5 H! K$ j2 o
string sqlu="select t1.fno, t1.fname, t2.fname as fdept from tuser t1 left outer join tdept t2 on t1.fdept = t2.fno order by t2.fname";
`8 ^, X- B( n8 i; ^
stmt=conn.createstatement();
0 L2 b; ]) j7 H9 D
rs=stmt.executequery(sqlu);
7 e0 n# y4 B6 K/ `/ k2 p1 a
%>
9 m" E7 W* r+ ^
<script language='javascript'>
8 m. P9 s: k# h" P
arr = new array();
& j, \& I+ {# \/ S( z! j1 z3 R/ n
<% int temp=0;
8 d+ r* Y2 U& ], f
while(rs.next())
# t- d) T% [! ^, p
{
5 c, O3 P4 \* F l" i. n6 Y
%>
, n c! J' Y) |. Y
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
% L5 H6 q2 N V7 S
<%
+ g2 G# t$ k. s1 G+ d' M( ^9 B+ Z$ c
temp = temp + 1;
9 p6 U, O3 g; y2 M% g' a
}
n( T! r6 H* w; n1 S( l5 A
%>
' E: X$ {7 P5 A8 I
temp=<%=temp%>;
`. h g9 F4 L" Q! Z6 [& z
function changelocation(id){
9 X( K+ K2 ^1 J; t* f
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
& @: n6 m- y" o6 E; H$ R4 y
var i = 0;
5 A; M" _! [! m6 M' [; k
document.combo_box.city.options[0]=new option('-------','');
$ }" q% O6 _& l
for(i=0;i<temp;i++){
& ]% s2 h8 g0 d* z1 h
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
8 A1 l4 O G+ f4 k
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
+ }! i+ L' L2 I
}
0 Q5 _4 M& z# s8 Y% y
}
7 P( n. _- ?& k5 @/ p
}
6 d, H' g+ c1 z( ]! B* D% D
</script>
+ g6 b0 d# o! j% \
* {& \" v' g- p6 I% X) T/ N, |
<form name="combo_box">
/ l) v5 G& l* j/ W0 N- f
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
0 v7 T8 c' T: I9 t2 ]6 t0 e
<tr height="24">
8 m- x1 A/ o5 I% L0 Y- F) Z1 H
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
- @, Y2 f2 O. b" P3 E5 x' L+ u
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
. w2 K# d( I- o$ I, g+ |
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
; A( q# N+ _1 ? N' W9 J! _% {
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
' N+ V9 h. h* a1 |* U
</tr>
* J' w5 y, D1 E* \! o% ], a
<tr>
1 j' K0 o H: E( t' e! Y; A2 u
<td>
) x! L# u- S; f- g7 g
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
" S% ^' q. N7 L$ A
<option value="0">请选择部门 ---></option>
8 W4 c/ A4 h2 p; ^0 \
<%
3 j1 k7 Y( u4 t: V
string sqld="select * from tdept";
" O# T3 T" Z% I6 x/ q
stmt=conn.createstatement();
?% v, }# N( \1 U3 F
rs=stmt.executequery(sqld);
& r# v8 n5 {) T7 m. E
while(rs.next())
" N {7 l! `. ^6 Y/ c5 V. q
{
/ _/ K3 R! z; k. }: N, o1 W2 `* y7 K
%>
& g! \. O( D$ P I$ G: D. f/ p
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
8 E9 S% Z8 L l- e2 i2 ]; S" ^
<%
2 R! C! r% P- @8 j. _
}
( _& I# i; q3 G9 x' o5 y, ?
%>
/ S; _) e" ^" W0 J
</select>
' ]" P+ i) m, U* G5 @& K
</td>
8 p- C2 `7 A V) Y: j
<td>
5 \! I6 J6 n9 @' _8 M* `2 g
<select multiple id=city style="width:150;height:200" class="bgc">
3 _$ ]: d. m8 Z- W1 O! a
</select>
0 U3 B! k. @8 `& k3 ?* Z4 Y
</td>
0 R5 f; G' P# Y1 V# ~ ~
<td nowrap align="center" class="bgc">
" N% {& Y% i& _8 g! |2 x
<input type="button" value="<<" class="buttons">
5 V n6 I1 E( h5 B* A
<input type="button" value=">>" class="buttons">
6 ]$ p0 U. n$ N9 x7 \, k+ `" Q: m
</td>
+ l8 ^2 b, }' J: _3 C+ z
<td>
5 A5 u% M# D# P4 {5 W. c+ r# M
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
$ G0 G( ?1 u# M1 ~7 S- j# s
</select>
) ^6 n" O( ]9 `6 k. f3 v( M
</td>
7 Y& o3 B$ E1 ?& j; r4 G" e
</tr>
! @" G, V: q! C* F: ~* K, p5 l
<tr class="bgc">
' I# I4 [' f3 f$ N2 A
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
8 V' y5 a( D# D/ Y/ ~
</tr>
7 }, G1 g% `8 K8 l
</table>
. q* x; w9 f1 p8 W
</form>
! U. Z6 K7 d7 w+ ~
<script language="javascript">
2 @$ N1 A w8 h. Y0 q1 K
//人名移动
$ H9 V5 f* {, K* N7 t4 Z
function move(fbox, tbox) {
/ S4 Z9 @2 x1 _4 g( W7 z$ W
var arrfbox = new array();
! X8 p9 Y5 a; d" I& A- C
var arrtbox = new array();
* ~! K5 y% \' B; w5 l
var arrlookup = new array();
8 g4 g7 |. B* C5 ~0 y
var i;
/ }6 t4 s3 H6 \1 `: d1 o
for (i = 0; i < tbox.options.length; i++) {
" U n% R( L% V% y4 F8 x/ X* I3 Q
arrlookup[tbox.options
.text] = tbox.options
.value;
9 r% [: B8 j( _! ~1 N/ w2 ?+ K
arrtbox
= tbox.options
.text;
% U2 C( v5 ^; f5 S* j/ R& g
}
( w- a/ p) @" ^8 v
var flength = 0;
1 J8 w' X/ n% P4 j+ |' e4 E
var tlength = arrtbox.length;
/ s; ?0 D% l5 D- }, R1 K" h/ m
for(i = 0; i < fbox.options.length; i++) {
# `7 \1 s; y3 }/ D$ v7 s, |
arrlookup[fbox.options
.text] = fbox.options
.value;
) o9 s( s: b# i6 }( d' {: @
if (fbox.options
.selected && fbox.options
.value != "") {
. t7 ?. R" c/ J: f
arrtbox[tlength] = fbox.options
.text;
" F; \! m* W% E" t" A1 v( [& m
tlength++;
0 q9 d1 c8 y+ {+ @! e$ V' Q
}
) r( A/ U' j0 Y
else {
" N1 q2 @% C4 w( g5 k
arrfbox[flength] = fbox.options
.text;
- p* v3 X% u. e3 ^4 q
flength++;
% f3 N- l7 m! N! A0 o' F& w, H
}
3 b# K8 T; {2 f+ u
}
4 q. @+ }2 M& V d |2 _
arrfbox.sort();
/ N# V0 { ?* ^' \
arrtbox.sort();
# n4 d F# {/ u+ J5 B
. ?, I1 [- ~ Q$ P9 B
fbox.length = 0;
& J$ c& k5 i# J' F. o8 q: p
tbox.length = 0;
6 k5 t9 v5 f( v9 G
var c;
2 C4 X. @0 O8 K% h
for(c = 0; c < arrfbox.length; c++) {
4 W' \$ ]/ e+ S8 s
var no = new option();
2 A: N/ ~& @; r; }! u0 r
no.value = arrlookup[arrfbox[c]];
0 [; N) e$ h% Y8 C
no.text = arrfbox[c];
, _6 W( s/ [# f; ?0 a5 C4 d# [
fbox[c] = no;
& R+ O5 }9 N0 e2 j8 @7 }8 D
}
( R# I9 `0 O& {$ g/ \. w9 h. J9 m Z
for(c = 0; c < arrtbox.length; c++) {
* J* {9 [5 Y$ U1 N# T9 F
var no = new option();
$ q9 ?) f4 n3 K- R
no.value = arrlookup[arrtbox[c]];
1 B" r( w: S# q8 m! I2 r
no.text = arrtbox[c];
2 o/ h: e, S0 W( R6 H
tbox[c] = no;
- R/ r) O$ O8 J$ F, u8 E" c& G o
}
. O* f% X2 `! t) _) O' d1 f9 S
}
" d) S' ?5 d# V/ r+ S
</script>
, z; u# b1 e0 s$ }8 U' m' A
</body>
5 q" R% }8 J' ?# G
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
