标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
$ f9 A1 P6 Z p3 Z& _/ w( K
c pageencoding="gb2312"
1 N* Q' m/ X' P1 Z3 r W
%>
8 `6 X' \5 n) p' @9 `( h9 ~" \
<style>
7 s8 L5 g# J- d
.f9{ font-size:9pt; }
, Q! S. p; s1 }' I6 A) }3 |( C
.bgc{ background-color:#aecaf9; color: #0033ff }
1 }5 p: H5 y5 B& q+ [$ ?+ I+ Z
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
! r3 y1 B4 [: r2 } _# t/ \ e
border-bottom: solid 1px #4e7dc1;
1 N( H* }9 \( c. H8 _/ t0 e
border-left: solid 1px #aecaf9;
5 Q7 R, u( u! }! ?% a1 Z
border-right: solid 1px #5679bd;
8 z6 f! y( s" j! m/ ?! C7 }" V6 P
padding:1px;
5 }5 o& F* _+ w1 b! f; ~. A2 G
margin:0px;}
' O! h6 Y9 ~2 e
</style>
- d) P s, a; C% V+ X4 g4 i
<script language="javascript">
/ ?/ g+ B$ H3 ?+ t% B, ^6 B @
<!--
$ t! P; ?% f( ^" f, K% ?0 ^. V! D3 V
function rv()
4 w2 Y1 Q0 t9 C+ D q( q' @! C; ]
{
' S& v" R9 ?. N/ _3 [2 l, ?
var val="";
" Z& I0 b; U; I8 p
for(i=0;i<combo_box.list2.length;i++){
$ N7 j' J9 b; `
val+=","+combo_box.list2
.value;
2 @9 v5 S' Z, @ P* _8 a; e
}
% J* e0 D3 V w% M$ `. a5 S/ w5 O$ R- u
if(val.charat(0)==","){
; ]: H! u! [" ]5 s2 m' x/ I
val=val.substr(1,val.length);
l& |* @+ k( X5 h: s
}
8 z( U& D% N; b% h2 R/ B
opener.form1.frecname.value=val;
7 F; a" A4 ^: C8 G
self.close();
6 H3 Z. ]* q* V2 ^8 W# V4 I: Z4 Q! m% t( @
}
, Y' ~8 K A7 h' z
//-->
- h7 P4 m& H6 w& K% m* }
</script>
i4 B" [+ I: {
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
' W# N$ q7 y% j+ S# z- I( d/ \
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
* V0 V G1 I$ h n1 r3 L1 y1 @
<%
& ~; B2 F) `1 F: ?5 \; H a6 ^# r" C
cdatasource ds=new cdatasource(); //数据联结bean实例
9 f5 W, F0 N) B; x' s; c9 V5 M, S+ K
java.sql.connection conn=ds.getconnection();
6 o v8 P9 @! Z! V
java.sql.statement stmt=null;
: i4 p) C& v3 } D O
java.sql.resultset rs=null;
; }( g8 r8 P7 F& K
cdatacheck dc=new cdatacheck();
$ m2 D6 h, \4 b
%>
% z3 ^7 x5 k& _. p$ p& w
<%
* o* G9 |9 b7 v8 Z [- H
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";
. F& a0 y$ l8 h; N
stmt=conn.createstatement();
5 B, ^" h- Y& ]7 j
rs=stmt.executequery(sqlu);
$ N0 ^5 }6 U3 I# A
%>
& {" d6 p. Z( z) ^ Q9 g# V! }
<script language='javascript'>
+ f. e2 c9 o" N! o U) ~! G
arr = new array();
& ^ c- g* H* x2 o- ?) t& N
<% int temp=0;
9 g+ z% ?, ~1 P% J" Z6 C V V
while(rs.next())
5 b& L3 Y+ _" V
{
) S% ` Q$ v7 s7 b! Y/ l
%>
; p' Q& K: _0 V' o! y6 ~
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
$ I7 w( g* I# n' a& K- \( }
<%
1 b: |7 R- G1 Y& W" J
temp = temp + 1;
7 i0 }% W( F4 v( N
}
4 V; U( N* n8 W# q9 K2 k- y
%>
; J" A l( l/ z! b: ?! n" F
temp=<%=temp%>;
5 t6 ~( s" w# T( q, ~7 [5 I4 G
function changelocation(id){
6 `: u$ w2 f G S3 T- l
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
# [. M; B' F3 K3 ?9 |9 O5 p# T
var i = 0;
- |- G l) G3 |5 d7 y1 |7 L/ `" h
document.combo_box.city.options[0]=new option('-------','');
: W* O% U( T6 N1 o6 B6 R
for(i=0;i<temp;i++){
# ?/ K t* j! d- W, H
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
; Y$ \7 \. F3 _3 V6 L4 k( q @
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
4 h8 z1 L% f- r# \# I
}
( V* u5 X4 s* n& ?, j( S" }
}
& b8 {4 Y9 J; N% J7 s' f6 u
}
% V( F+ m) m/ |% \) E, S3 h9 \
</script>
# Q% T }* x8 e5 T$ ]
) ]/ z' o9 n0 b+ a
<form name="combo_box">
' E6 ^2 a* Z, M2 n# M
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
0 c$ f' G: |0 }
<tr height="24">
! O: H/ f2 m+ P: @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
" {" C; t! ?4 u
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
! n. N' z3 G0 |7 y2 ]
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
' T+ q: d9 X" N. ~& n' Q
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
- h, r5 |9 b( p0 J# }* I( @, i
</tr>
J3 d7 `8 G0 k0 ^% r* B
<tr>
& N4 N% j. F: P: v: b# Z
<td>
9 V4 |0 W$ ?. ~
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
) P% i5 X) ~* ~) d4 [+ ]
<option value="0">请选择部门 ---></option>
5 Y+ Y9 e) z1 r5 J, y; l
<%
7 K x7 v" E2 L8 ?# N# @
string sqld="select * from tdept";
8 W# W) h5 S. R
stmt=conn.createstatement();
" {( Q/ d4 m5 w3 O& t6 B7 P
rs=stmt.executequery(sqld);
0 o9 ^ I0 A; U: J
while(rs.next())
( V$ M3 Z: L2 P
{
7 K% X9 A* W5 x5 f/ ?
%>
8 q3 G. _1 ]: u; q$ |" ?& k1 w
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
2 d/ o2 s0 C4 L% J) W! A- p C, C) r
<%
; [( \) a6 S+ S% p# ^
}
3 o$ ] V* W1 L9 W* f C! F' {* |
%>
/ j# M: y: B7 Y; r- |
</select>
$ R$ H4 r I& T. a5 _& Z
</td>
; a0 g" p7 }" j4 }6 D Z0 W; s
<td>
7 L! m' P; |, }( [
<select multiple id=city style="width:150;height:200" class="bgc">
, |: J2 h3 [( d( }2 S# Y) b% M
</select>
. p% t: z \$ ~+ m) c) g
</td>
# Q7 }* a u d& g/ e
<td nowrap align="center" class="bgc">
5 X2 v1 `( W$ R. N
<input type="button" value="<<" class="buttons">
6 n9 u: C$ C8 y
<input type="button" value=">>" class="buttons">
; p' J2 w) X5 v) |% I
</td>
7 I% Q6 b" h+ ^2 Z
<td>
: S( M- F' w# B" E
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
; z. L B7 \9 w; _$ g E) z E
</select>
; z+ q) y8 X3 _( ?- ?9 \, F
</td>
8 R; E) U2 j* A5 H
</tr>
/ b7 t% w' S% q3 ~# {8 g& k
<tr class="bgc">
2 o1 L1 E, |4 m' z. _" K5 K
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
# R* n5 L% `, x4 m( D! f2 o
</tr>
/ u# j) Z: y: G6 ^ e7 ~
</table>
[1 k% w& d9 `! q
</form>
8 p' T6 x3 e" E* J6 U
<script language="javascript">
: h+ Z R) z6 @2 `& d3 |# G
//人名移动
! ]6 p& S: j% x6 @4 \, P: A
function move(fbox, tbox) {
4 k: a) S/ e R3 K- |: ~
var arrfbox = new array();
7 ?2 B2 d7 @( M
var arrtbox = new array();
. r: A7 x& r. C, ^$ |7 j) W& {1 {
var arrlookup = new array();
! P7 u( @& ^. k' g1 v8 Z
var i;
* D' B2 F: @; z: r
for (i = 0; i < tbox.options.length; i++) {
" V+ S# |+ O3 ?% @0 C1 Q5 V
arrlookup[tbox.options
.text] = tbox.options
.value;
% d) Q0 e+ Q2 V! p( Q9 P
arrtbox
= tbox.options
.text;
# b$ M0 i& Z4 D2 e- [9 J
}
; \; s7 V. p/ Y& r; l, d1 j
var flength = 0;
, v$ X" \% m" G0 M0 j. k
var tlength = arrtbox.length;
9 b4 E* k5 d" s1 J0 r5 ?6 O
for(i = 0; i < fbox.options.length; i++) {
) t8 @; k4 G/ W: ~2 L" F
arrlookup[fbox.options
.text] = fbox.options
.value;
' V, c2 _5 B8 }5 K
if (fbox.options
.selected && fbox.options
.value != "") {
8 `- z+ U6 p. w8 m
arrtbox[tlength] = fbox.options
.text;
; m+ Y- C# w- ~) l) E8 V
tlength++;
# ~" Z9 ^4 v0 T5 \$ G [. Y
}
. ^7 m3 \5 K% X1 [" C. A5 ~' _
else {
' b7 a& N/ B4 Q4 f6 O' g
arrfbox[flength] = fbox.options
.text;
" x! \. }1 H' K/ g
flength++;
! T" A" h) h: l0 v
}
- k6 P0 i5 W# R# b* S
}
. c T, M* C& g- D" R0 e
arrfbox.sort();
/ g' Y& S: v% A
arrtbox.sort();
`8 Q3 |, X C, }: G( x" m6 Z7 q- g- R
: r8 R) o( \" ^( \0 e6 _8 D1 V5 i
fbox.length = 0;
% M; Z9 `5 K8 l" @6 X& A
tbox.length = 0;
. s; D6 L7 m- q7 s6 m9 O+ r
var c;
# W4 D: d- M8 d$ M' [8 b
for(c = 0; c < arrfbox.length; c++) {
m7 b3 @1 L" a- s
var no = new option();
, ^! n" d" v+ h! Y' }. t1 i
no.value = arrlookup[arrfbox[c]];
) u' C+ _. e! u) e: J% o
no.text = arrfbox[c];
& C+ v1 }7 F/ v' O
fbox[c] = no;
* n, M$ j" |5 C& u' L8 ?' H
}
# ?/ u: A# G6 o7 \9 U# b6 H4 l
for(c = 0; c < arrtbox.length; c++) {
. D: U0 R( r, a. ^; D* `
var no = new option();
1 B! A' i0 c8 J v- q4 c: I
no.value = arrlookup[arrtbox[c]];
6 F; X+ y- Z9 u
no.text = arrtbox[c];
+ w. x9 X; j ?
tbox[c] = no;
) E, H9 q7 E$ S
}
, f& ^, S0 Q, A7 {; b. i2 ^
}
: q5 L `% N/ k, P3 _1 b
</script>
1 }5 O! o* Q' @# @" w0 `3 P6 D0 q
</body>
2 }3 r7 i- s) Z& w7 J( o$ L: O
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
