标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
: k9 X9 f4 W& ^2 i! I
c pageencoding="gb2312"
8 g: c' E( V6 L9 g* L
%>
9 Q3 Q) y" X4 m9 U
<style>
+ s. a* \3 j m4 ~- I a! J" o
.f9{ font-size:9pt; }
- [9 D P0 X) _$ @
.bgc{ background-color:#aecaf9; color: #0033ff }
$ Z; m9 f) q4 D1 [' u
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
A8 D) ]$ ]2 i2 H5 r
border-bottom: solid 1px #4e7dc1;
- z6 \" ?# {; y8 n% H/ Y
border-left: solid 1px #aecaf9;
& |6 K3 s4 c5 p& x* k9 B# u6 n
border-right: solid 1px #5679bd;
6 p, s% i* a' u8 m0 X9 Y
padding:1px;
* P8 f3 Z7 ` F, a. l0 o9 `! F9 Y
margin:0px;}
4 H# p- a3 x, M: Y' B+ `) L
</style>
C1 H; R9 X, p/ W( Q' v) Z K
<script language="javascript">
; t9 ^! D( v) ~% I& _
<!--
1 K: q! V( C. \$ T+ G: j( E
function rv()
2 x c' j2 j- _( v1 r
{
* }" `) D% Y, v4 s
var val="";
4 ~1 Z" |4 ~; p1 v- w2 M
for(i=0;i<combo_box.list2.length;i++){
" ~3 K' D$ s' T
val+=","+combo_box.list2
.value;
$ }' K# N) C& J) C/ C8 T
}
- j- I3 T, K4 j6 I6 F; z
if(val.charat(0)==","){
" M q/ `& i0 Y% }0 V3 l
val=val.substr(1,val.length);
4 W. C2 e/ l2 w7 {' a' W
}
7 q3 o( N) s5 E: A, G
opener.form1.frecname.value=val;
?' g/ R _$ Q9 X
self.close();
9 g" _* S0 ?% p$ M8 h% s
}
- |8 ?$ ?* m9 S+ G
//-->
1 [; M1 G- u9 {5 l% N* v, z6 E- c
</script>
# m' l3 @# L: J* z) I, e- C' L% }9 q
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
* Q& d4 v: i: n# l
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
- ?9 x9 l" d& v0 _3 p, }6 i. K0 O
<%
' p& Y- M" c' y
cdatasource ds=new cdatasource(); //数据联结bean实例
' s% s+ ~2 A: G1 a7 o
java.sql.connection conn=ds.getconnection();
( u0 k* {! v! T
java.sql.statement stmt=null;
6 H) H- {" ]/ }" C2 z
java.sql.resultset rs=null;
`6 W0 T( `% f, i# Y- C
cdatacheck dc=new cdatacheck();
0 E1 q! g1 W0 R$ N$ P1 _9 R
%>
+ w. D+ S( t% P h a0 Z6 a( ]- I
<%
9 Y% B4 D9 v5 x' G! t* l. ~" Z
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";
' I+ r: U/ t8 ^! r4 d
stmt=conn.createstatement();
/ N, N7 K1 w$ D, Z3 N: _( b
rs=stmt.executequery(sqlu);
; Z9 e7 h2 |- i( O; ~
%>
: N: O6 P+ ^& ?6 v
<script language='javascript'>
' r7 u# S m" G: z
arr = new array();
0 u" W% d% u* m( L+ o3 F' G
<% int temp=0;
* t6 R$ s" V# h
while(rs.next())
3 w, g( d$ L1 u; y+ H
{
. B' x$ J$ S" h6 H, o
%>
' d+ y& P5 n! K6 ^/ J9 F
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
* {/ P% `" Z0 _# p6 s4 U" b% a
<%
7 `3 S ]. K, V# A! V
temp = temp + 1;
, B" J3 X. ?; ^8 \1 W
}
( {+ C6 n) ?: ^' }% e! `
%>
; n5 D7 K4 R" t" |& Y0 Z; |
temp=<%=temp%>;
" V) q( X1 Q4 X! `+ N" R
function changelocation(id){
1 u- ?. b/ \8 A" d2 T
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
& Q7 j! {& c; [* C0 { G% i& g$ B
var i = 0;
- b: Z( f8 f% O
document.combo_box.city.options[0]=new option('-------','');
: {5 B9 l6 c$ q2 t' x& ~$ P4 d8 ?
for(i=0;i<temp;i++){
# {4 |2 n/ V. F/ o
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
- W* f/ E( n3 R" U% d
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
e- d7 K1 d+ X% k. R/ f+ a9 A
}
& ^* w+ K& J+ x2 j
}
4 l8 z& Y0 o8 U1 m
}
d" z3 l$ ]+ a
</script>
3 Y3 ]2 Y4 r7 \* M6 t+ A/ e
1 v1 N! a; K% N
<form name="combo_box">
! N# w8 l6 R. n6 m B3 c, Z
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
! v, Z2 P% N0 d
<tr height="24">
, }2 ?; @8 O( }$ ^. n; `
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
0 U+ a/ t$ ^. q3 Y. c
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
: K8 p2 ?& l! u0 {8 j
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
" {$ O3 y( w; c9 w. R
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
+ B' O+ a8 Q1 b6 |2 ]4 W
</tr>
) s6 W1 Q8 N( \4 O$ K
<tr>
4 R& |/ U, e! A; q6 V& W
<td>
! G6 @8 l( M$ h1 }: }
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
G8 `: H; {* `5 @1 S
<option value="0">请选择部门 ---></option>
* U% w U" z9 [3 \/ i# W
<%
3 J: \* s. h8 p' p) D, y
string sqld="select * from tdept";
. P$ C- \$ S& F$ U# u7 A- u
stmt=conn.createstatement();
! @9 x0 b, w! n* R+ t7 M/ S
rs=stmt.executequery(sqld);
7 H; O* X: U3 {5 U
while(rs.next())
/ M S; H, V* g( h, X
{
( Q. V9 ~9 f9 a9 Y* C. q+ _
%>
; L3 r9 e6 |9 Y% K
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
7 U. P6 _ }' | `: k
<%
* H: u8 ]2 k. H- X0 X& ~
}
# Y, s# n) l4 z* K
%>
. r! C( ?, K' H7 i1 e: L- J- b
</select>
3 [) M* I6 h. {6 f% `# o y
</td>
. X; V) }6 z4 _7 v5 t" ~' _- t; V
<td>
, k) z/ d* V) U. {
<select multiple id=city style="width:150;height:200" class="bgc">
; Q6 F; }3 i* b+ y. @
</select>
" _; w5 c" Z4 u7 e$ y+ a6 A8 g/ a% z
</td>
$ [! p2 E a9 ^' P. G
<td nowrap align="center" class="bgc">
4 h6 Y+ F! V$ s. J0 I" y3 L
<input type="button" value="<<" class="buttons">
) f0 t. N# \# u: {5 y
<input type="button" value=">>" class="buttons">
. h) Z: a3 L) ^& y$ M3 B
</td>
* D! e- S3 `" _. x* ~- N6 L
<td>
2 L5 I" }! `* F$ k' T
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
+ V) B# M' m4 B, _& [; a% b. K
</select>
) E1 O0 @8 F4 F& f2 {
</td>
3 y9 f7 x: K3 ~ n# y
</tr>
) m4 }% ]0 O6 ` N+ y. q& ~4 m0 f
<tr class="bgc">
& S) r: g! ~' y! n2 Y6 Y& `, X
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
; Z% `+ I; h- [$ a' h
</tr>
, V2 A1 ~. I! b4 [7 v2 y) e
</table>
9 W& s/ T. j! A3 {
</form>
7 b* V/ N( [ U7 a1 c* y
<script language="javascript">
$ }+ t% T5 O0 ]( |. t9 m; y: c: A
//人名移动
1 l/ z" u: X7 G4 P
function move(fbox, tbox) {
* X& ~8 e1 z" w- B& _9 r
var arrfbox = new array();
$ t3 F3 T; z6 q* M
var arrtbox = new array();
: G8 J2 M/ k. ~1 t) @" R% H
var arrlookup = new array();
/ q& R0 I/ w6 i* ?4 U9 k
var i;
+ g: W2 l. p1 \6 s# O* |; v! y% P
for (i = 0; i < tbox.options.length; i++) {
+ H t }8 y9 t8 R' q. j3 P
arrlookup[tbox.options
.text] = tbox.options
.value;
l1 F& a+ T3 ], x# O
arrtbox
= tbox.options
.text;
: d* g# ^5 V( ?, I# u& s
}
2 Y4 }% M, R8 O' S
var flength = 0;
& A& J2 i" M* ` R: j" i
var tlength = arrtbox.length;
B7 M) ?( W n0 e5 s
for(i = 0; i < fbox.options.length; i++) {
9 l$ u3 h5 M; Q
arrlookup[fbox.options
.text] = fbox.options
.value;
+ W& C7 |4 e# c d* X. `1 Z
if (fbox.options
.selected && fbox.options
.value != "") {
& i' Q7 G) k6 A7 f
arrtbox[tlength] = fbox.options
.text;
) V6 M, L' i2 V: Q3 p
tlength++;
. s4 |( p- J7 v& Q, t* Y
}
0 K. p2 g' H! D3 j& _% Y
else {
& b6 G* ?; L) j; p6 B4 a
arrfbox[flength] = fbox.options
.text;
! k9 Z5 f z1 t/ d. B& J/ O- v ]
flength++;
: B7 w) g7 `# Z* t
}
& Q* Y9 c7 _+ a
}
E7 }! b, L$ p+ q# t
arrfbox.sort();
: k% v F' ~/ g0 R3 R3 d
arrtbox.sort();
4 j6 f) u( q( H1 g
a: Q" }/ b; o: n9 l
fbox.length = 0;
* K2 L! l; \; S- P
tbox.length = 0;
1 k5 F' g& `, D; z; o5 @% ?
var c;
4 ]/ B+ T( ?: E4 X2 t$ p3 u- t
for(c = 0; c < arrfbox.length; c++) {
8 i8 k# @! Q3 W7 [% c- G
var no = new option();
* `, i" \& ^! N* E
no.value = arrlookup[arrfbox[c]];
6 X' m9 a* c. f8 P
no.text = arrfbox[c];
$ T# l! l% l8 Q
fbox[c] = no;
" g' y0 z. O. `3 b: m6 c0 D& v
}
9 T, T) z; Q6 `% E( \% C! Y
for(c = 0; c < arrtbox.length; c++) {
# W" `- e. g: L2 s! N* n6 I2 N
var no = new option();
0 X- ~- e1 ^! d! S( ^' `1 Q
no.value = arrlookup[arrtbox[c]];
$ d/ s& m4 Y4 h' K
no.text = arrtbox[c];
8 z }' a: @7 N5 x
tbox[c] = no;
3 N* B |' y- E
}
5 }) R8 ^. q, ]- C' R l
}
& j ~ n1 y& O5 ~0 d$ n
</script>
+ ~5 e H- q' q9 d+ Y: X
</body>
6 U" d, ^3 A9 ?8 l" K! z7 Q
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
