标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
, |2 Y- p% B1 T+ ] m
c pageencoding="gb2312"
+ d% P" E1 Q: Q2 f
%>
0 r$ L6 t5 |7 x0 o, a
<style>
8 Q6 }. X$ A- o( L0 H8 d2 b5 H
.f9{ font-size:9pt; }
$ M, x- ]1 h# }
.bgc{ background-color:#aecaf9; color: #0033ff }
- }. `$ l D8 _/ M6 H' c* ^5 {
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
4 X* A9 C! F2 n% l& k( ^. T
border-bottom: solid 1px #4e7dc1;
3 c) ?7 f) k) L% I% y8 p2 x
border-left: solid 1px #aecaf9;
. ]' m* H C; ]) C( y
border-right: solid 1px #5679bd;
' X) |( E. {, \
padding:1px;
# K3 ^0 {& ?& O, C* x5 u
margin:0px;}
) |4 e/ F6 P) r( M, y9 p: r8 f
</style>
7 I9 V9 y, D" q& ^4 m R
<script language="javascript">
+ D. O1 A( o- k! g( Y5 }+ f1 |4 ^
<!--
$ T$ w6 z2 T1 k) m9 m
function rv()
- d( |# y5 X$ m/ ]3 a1 F3 l9 L
{
' t& X/ G! R% O- _$ {
var val="";
! r5 R: f/ q1 z( @
for(i=0;i<combo_box.list2.length;i++){
+ }; i- G1 L. X" F1 w3 V( i
val+=","+combo_box.list2
.value;
3 q+ f$ D, }0 G' Y. E' s
}
, U4 _- n% g, b; e7 I% l
if(val.charat(0)==","){
3 Q: I. P1 Y8 r% r3 k& I# t
val=val.substr(1,val.length);
" A/ y: @7 j- h& ^# @8 Z6 o
}
; b* q2 T! S3 I3 a5 m
opener.form1.frecname.value=val;
: w' P% P7 M2 p
self.close();
' Z j! E' K5 R* f
}
4 a m Q, B4 J, t' a
//-->
& @& V8 Q* N8 i: ~3 O: Z. l/ v
</script>
, G9 c- U1 _" Y+ Y1 J
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
3 D/ ^5 s( Y/ m) g! h2 ^% ~$ N( h
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
% B+ U9 N- r3 P0 t3 ^) `
<%
/ p7 f9 B: I# V& _0 [+ P
cdatasource ds=new cdatasource(); //数据联结bean实例
; ]/ c: b! H5 W# p: p1 ^6 z
java.sql.connection conn=ds.getconnection();
2 q( }9 \) c6 @
java.sql.statement stmt=null;
* `, g: g6 A- R/ c9 u7 u1 j) l' k1 V
java.sql.resultset rs=null;
. r! L2 l' C, A9 k- r
cdatacheck dc=new cdatacheck();
/ K1 y' }' R3 A) S" _! F
%>
/ B2 V6 s9 Q# D* }- R
<%
6 n9 C6 G1 z+ m, w6 z4 Y) m$ 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";
; G# A& Y& }3 c0 I; \$ c
stmt=conn.createstatement();
" @* i0 L% s2 W0 t: o
rs=stmt.executequery(sqlu);
! e) J0 j0 ^+ y) M- w: d
%>
3 ~, g, `. y/ m* K
<script language='javascript'>
% h+ H! A# v7 s
arr = new array();
# l A0 k2 p. Q+ P
<% int temp=0;
% e' f8 }1 g! y$ P4 ?- [' I
while(rs.next())
2 F' _- C+ E, i' u0 f8 t- J3 f
{
. L( `" w/ ~9 c* K' [
%>
2 A' N5 A+ c! z' ^4 z. R8 l+ [
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
! M: x3 t& Q; `1 Q$ j+ s8 H! ~" S
<%
' o$ C% t4 M3 w2 e. y8 r0 s
temp = temp + 1;
+ }" _6 g& {& M' H! n
}
$ x# Q: U( V$ }9 p6 g8 j* ^
%>
# Q) b. ^! K/ L2 l
temp=<%=temp%>;
% Z% g% I6 P, _) x+ @1 n
function changelocation(id){
/ D- Y. y6 Q( m4 S7 \" n3 Q3 e
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
" P3 w& q5 L* z2 J0 y$ u( C
var i = 0;
9 ~1 R- e) `0 D7 e4 L, j
document.combo_box.city.options[0]=new option('-------','');
9 h7 m( n9 [8 D# n+ H8 |& R( ~0 P
for(i=0;i<temp;i++){
% w" N" a3 v( ~# ~, z
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
z# g; ~* p* n4 r+ ?% v& e
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
- X/ g" {" B( a- F
}
4 C- W- b5 Z& b6 }7 W
}
, C5 x$ W, B8 Y( h
}
8 h5 N1 V/ m/ H. o
</script>
; P6 o- _, d3 E3 s/ A9 u5 w' j
. _9 ~& a0 N8 w; |1 v' [/ i Q
<form name="combo_box">
! c \- ?, s" R; q* b
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
: M3 G% B+ C" w( B# ?4 M! r
<tr height="24">
- u/ C+ S1 ^' m6 c
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
4 w& o% f6 _" r* d
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ A* E6 N, p9 P8 D' D" r1 q+ k
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
+ H) N) j0 w% L4 M+ y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
" i6 v! J) e6 K; {
</tr>
8 O8 }* r" u/ N( e
<tr>
& z! ~9 Z4 ^4 G$ P3 ^- y8 a! \5 N
<td>
3 d" @( R% i3 {
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
* u0 h* B2 R2 s# ^" Z, g
<option value="0">请选择部门 ---></option>
) P3 p9 V' }8 H$ w( I( ?) g
<%
# G$ Y4 {4 d* l: s- t) w
string sqld="select * from tdept";
& J% ~" p: }) a
stmt=conn.createstatement();
6 o: n' I9 {' g( a! Y+ T. @4 F! A
rs=stmt.executequery(sqld);
2 j' m9 t/ ^* Q
while(rs.next())
" D6 A# w/ O6 F8 G$ b1 T X
{
! Q. B/ R8 H: k T
%>
4 D2 ~! W& `/ A+ k: e
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
0 X7 C9 R: Q$ c- Y4 {
<%
& l8 }$ N) u+ ]# `& i" q% r8 M( N
}
6 X9 l9 f6 J$ X6 l
%>
, C7 D; |2 O# ~) u+ ?: ?
</select>
! A6 Z' b, O0 d( \
</td>
3 h. W' c. W) L. a e6 M) ]
<td>
& A: {* N4 j1 T& ?# ]
<select multiple id=city style="width:150;height:200" class="bgc">
1 m1 n# ?* x7 S) q9 H. `
</select>
- \# p1 W, F; U# P$ n& q
</td>
% B$ k6 y5 Z% ]5 a. j4 M: W- \
<td nowrap align="center" class="bgc">
, D: L- G2 c: G j' K. @ r$ j$ b
<input type="button" value="<<" class="buttons">
) U& G5 M& J2 g7 q, o! ~/ T
<input type="button" value=">>" class="buttons">
2 _9 c9 A3 ]0 m# D0 _
</td>
2 l' o1 ?9 C: J; g! P0 V1 K0 W3 o$ \
<td>
, q, I' X7 j2 }3 M% V' R
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
9 |0 d( V# j( q4 O; U4 x
</select>
2 W; c* r# f: f H% t
</td>
6 Q7 L# @% B+ h0 f `# b
</tr>
4 M) H1 t! ?* _; h! I m' h% z0 |
<tr class="bgc">
) ]/ t% U _- q1 w; y( ^
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
9 d6 v) Z" e! @' H
</tr>
+ j5 d+ J* m4 K
</table>
/ M8 O1 P. c! P0 k
</form>
' D$ m/ [- d$ @
<script language="javascript">
5 P8 Z" f3 G# k, R7 o( z
//人名移动
|% `" @, Y+ U4 E; y p" g2 S/ `
function move(fbox, tbox) {
. h- i" j' c M& l& A
var arrfbox = new array();
( f; L {9 t" ?
var arrtbox = new array();
6 L$ H( }4 s- f. a! h) E9 f* o
var arrlookup = new array();
# J* [. o; w. h
var i;
+ u$ Z s1 M; ~: {7 h
for (i = 0; i < tbox.options.length; i++) {
* k: r% ]$ J$ d
arrlookup[tbox.options
.text] = tbox.options
.value;
& P/ D4 k6 } M" F3 W3 p' ]
arrtbox
= tbox.options
.text;
. k4 P2 b* V2 g2 F8 a8 F
}
4 O" z+ F! Z6 J8 `
var flength = 0;
- t, l; ^: B, y0 M" K; @/ g
var tlength = arrtbox.length;
8 ?/ m" ^4 p7 S, g, q
for(i = 0; i < fbox.options.length; i++) {
# n- F$ N5 l% q
arrlookup[fbox.options
.text] = fbox.options
.value;
" L, i w, r4 a. \# m$ ?
if (fbox.options
.selected && fbox.options
.value != "") {
: @7 d9 ]9 |& k" K2 C( `
arrtbox[tlength] = fbox.options
.text;
7 S6 \' |! \8 T2 N/ C
tlength++;
# E5 u4 ~! I1 ~7 o6 L1 u6 b8 L
}
8 E; [7 S4 o- c5 o
else {
% j7 ^$ u* n+ `
arrfbox[flength] = fbox.options
.text;
' J- w) i; K" h& z8 [/ q
flength++;
2 @! T. j5 J5 u( O. |2 h1 G$ |* z; A
}
8 o0 u" M$ ^ M# m+ n B
}
2 B" N$ o/ \* n! o4 U
arrfbox.sort();
X( d% C% s' ^2 m1 m, v! L
arrtbox.sort();
0 m7 j7 O: ]" |( g$ ]: Z
# t9 f' @+ I+ X2 a
fbox.length = 0;
. D2 s) y! M+ |7 G9 p4 \& B j. @5 b; o
tbox.length = 0;
# d# d- v% C% k A
var c;
8 |- e/ M! I( K: x# E
for(c = 0; c < arrfbox.length; c++) {
8 L5 j/ `7 l \" B; C
var no = new option();
- c3 i& ^- A* r
no.value = arrlookup[arrfbox[c]];
8 F, {& ?$ x! `! E$ O
no.text = arrfbox[c];
2 _8 g, D# j4 f) L4 ?1 e, R
fbox[c] = no;
O: f: q7 x5 E( r5 I% [# M
}
, B1 e8 C! O" n2 C
for(c = 0; c < arrtbox.length; c++) {
2 K3 D. H( B8 ~$ {0 }$ q- Z1 s
var no = new option();
9 ^" p6 G8 u* Q. i: w! y
no.value = arrlookup[arrtbox[c]];
# W# O( Q Z7 r- D
no.text = arrtbox[c];
# P7 y. L( O* {6 }- k/ l- R3 N
tbox[c] = no;
3 B- y7 y+ i( b. J5 y* \) U8 u
}
# |8 M! Q( l2 Q; P+ [
}
5 E( V% C$ ^& U/ b
</script>
, t5 Q9 L5 f, E
</body>
- q3 n1 p) ]" P. ~
欢迎光临 捌玖网络工作室 (http://www.89w.org/)
Powered by Discuz! 7.2
