标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
) L# C' \ Y# a6 a9 w' v
c pageencoding="gb2312"
6 Z4 m5 B9 _* z! {. M; K' x, ]" f
%>
$ _9 [0 `/ v. e- B- {: a8 z
<style>
1 K+ s5 G8 k" `$ O9 }' C9 S
.f9{ font-size:9pt; }
( n3 J) k" r7 i" X0 W
.bgc{ background-color:#aecaf9; color: #0033ff }
+ p5 w* `+ |8 P# }1 |
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
4 t: L9 z9 T& w# n [- _" {
border-bottom: solid 1px #4e7dc1;
4 P9 i; ^) t' q% z
border-left: solid 1px #aecaf9;
' h" F1 D* s! J& g* N7 T# v# C
border-right: solid 1px #5679bd;
" c1 d: G/ U( j
padding:1px;
. W% r) i# d& f* g+ z5 r
margin:0px;}
; R2 C+ Y- s4 u- b4 V& [" W( c
</style>
* K: d; W/ C+ f
<script language="javascript">
9 f( d7 Z- i1 `; g
<!--
q; l0 t! y: I$ |
function rv()
% @3 l( U0 o6 C: G2 Z& V% ?
{
7 e/ x4 }; N' J% r/ ^
var val="";
1 P+ ]4 B' p& z% h
for(i=0;i<combo_box.list2.length;i++){
- {# h1 S; M. H
val+=","+combo_box.list2
.value;
$ [9 ^- b# ?( u" J. x: `1 _8 `
}
5 Y0 x- v# ^/ g. r, S7 n
if(val.charat(0)==","){
- w' r! f5 r# O' ^! K K$ t7 h
val=val.substr(1,val.length);
/ {* R- _/ X9 Z7 P4 z) ^, B
}
0 [$ v/ U( W; g# E) a& k0 T0 O, A* M8 S
opener.form1.frecname.value=val;
$ Y0 H1 c) U% i* h3 T
self.close();
" ?. u8 d) \9 ^" ^; b
}
0 H6 M0 G' P: V. R
//-->
' |& X8 ~' g: Q) T. b0 q: k" r9 J2 e
</script>
4 S+ ~# g; _9 t3 ~( n5 ]. Z! S4 m: y
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
4 H3 y* j4 s0 ^0 t/ [( f9 q8 h8 ]
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
$ T) Q) v) O5 d
<%
) t( t* Z' ^4 k8 n1 i* p! r
cdatasource ds=new cdatasource(); //数据联结bean实例
! G7 ~1 A0 N- ]# o* O# m
java.sql.connection conn=ds.getconnection();
0 S: h5 y. b& k& P9 Q5 p
java.sql.statement stmt=null;
# t3 B# ?, w. ?/ E* j8 k
java.sql.resultset rs=null;
4 Y) e0 ]; K; D+ a
cdatacheck dc=new cdatacheck();
0 B6 I* ?! b4 G O! \' a+ i
%>
: F0 b- ~/ k, w. d4 _- @
<%
& \0 C+ Y$ ?3 W; R% E& E4 r9 g
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";
$ {+ h8 _/ E+ Z: W8 U
stmt=conn.createstatement();
1 R+ c/ b' N' h# l \
rs=stmt.executequery(sqlu);
% k1 `; J! f) u8 ~6 C( Q( ~5 y) f
%>
9 C) L8 A$ A% H5 v
<script language='javascript'>
e! ?+ _9 M/ a+ Y) i" q) h( q: ~
arr = new array();
. ^. |2 w! p7 {/ H0 Z
<% int temp=0;
$ ]; Q9 ]8 ?# Z8 Q, D# n9 @
while(rs.next())
# i) x: h7 b5 v' S: Q* V" F# ^, Y! [
{
2 G9 U, [ A7 U& q4 M
%>
; r8 o% O3 ^) `, e5 s
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
$ E+ L$ t4 e0 a) o' B* q) S4 L. a
<%
1 |" \" N2 w% o; z7 h' C
temp = temp + 1;
6 p5 ?4 X, W7 f9 \/ e
}
$ X- j; U6 N6 N8 G
%>
/ K$ }1 g) T# e/ s, y. N
temp=<%=temp%>;
4 t' p" c3 G# a
function changelocation(id){
/ ^6 m# } c3 ~' s/ ?
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
) ]) I e+ c5 r3 [# D6 o! Z
var i = 0;
, K, K& \; F7 y7 w& a
document.combo_box.city.options[0]=new option('-------','');
L/ z! @! h6 C; b! v9 _$ | j; {
for(i=0;i<temp;i++){
0 p+ v v2 t$ E/ s
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
/ U( i5 v: w3 N3 I1 s3 Q3 `
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
8 e/ |* L4 @# T* ?% S
}
* t4 ~5 O% a( F+ R' |$ [# }
}
: _8 t7 N; C; u0 D8 r& W, L* o( ~' ~
}
5 P$ z" |, _& S, j6 t X' Y
</script>
; I# [1 b7 M/ z1 M. }) S
) x2 T% C6 }9 g" B$ z
<form name="combo_box">
6 d2 V' ] V; A1 Y z
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
% x& {, Y( t9 A! o5 d8 D" F& [
<tr height="24">
' ?' U# _* {- v: r. n5 K/ O [& d
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
( d% O7 c. T) R2 i9 o9 n8 `
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
$ O; M. K" l: q
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
3 O+ _: n- ?) N* }& G# n0 J' U
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
; N, c4 V! b+ c. X% I% F
</tr>
$ v" x( p& r1 Y9 Z
<tr>
8 J, ^, }* Q" W; r% }7 r
<td>
) V! t) j( G1 k: N; q( A4 q9 e- o
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
5 Q `, C$ @8 o9 L! u. S @
<option value="0">请选择部门 ---></option>
$ c' H! X) W: ^5 E! G
<%
4 M+ r+ ?* Q/ _9 _
string sqld="select * from tdept";
& c% X h# K" |7 v
stmt=conn.createstatement();
, b& ?" }( J2 z0 Z5 N1 J3 U
rs=stmt.executequery(sqld);
8 `& i- O1 K0 F0 v$ u J$ Q
while(rs.next())
. e) ^! I7 `5 F- c3 h: _
{
5 Y G0 _4 i8 l- s. v; [% j
%>
0 Q4 ~5 E# z2 j8 L
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
* S) k! X ?! N( [" |1 |5 T
<%
: B9 Y4 C2 W1 L4 C6 m9 W
}
* Q9 n+ h8 a6 a9 k4 {
%>
4 G: A/ n9 d, _
</select>
9 D; U/ n9 f0 k) y
</td>
- M, J6 a8 {. c/ G% i# \" d6 M
<td>
( u! O1 e% v' f5 F+ D: w
<select multiple id=city style="width:150;height:200" class="bgc">
. _& N: x& H4 `: q- o0 M
</select>
% y" a3 H1 q% Z) n2 l1 q
</td>
' u1 L; W& S1 F7 E5 C5 l4 Y
<td nowrap align="center" class="bgc">
$ R) T7 t2 }! S( L
<input type="button" value="<<" class="buttons">
. p0 ]: ^ E6 \1 ]
<input type="button" value=">>" class="buttons">
! r6 V3 K8 T2 \- r4 u0 Z+ ^
</td>
- L3 a3 L3 _5 [# m2 C
<td>
$ b" X' w# ~9 V$ w7 m
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
/ k2 }6 S% ~- A/ \+ u- K% {8 O5 I
</select>
; t D. |' q3 H0 y% B- B4 ~
</td>
" ~: j9 ?9 f: z+ J2 A
</tr>
, {2 D" E# {" m: u5 J- P
<tr class="bgc">
. f4 C B! T/ y! G h# W
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
" I \# S6 i+ `$ y/ U3 H
</tr>
4 O& [) q9 u" Z* X; p; ?( l
</table>
1 ~0 G6 `! T9 I- i3 O, q3 c7 |5 t: P
</form>
0 P1 M1 f3 ?/ \+ v
<script language="javascript">
+ b7 G; C# G9 x& B0 T3 }
//人名移动
8 b% S/ x) R$ w6 ~: _7 B1 p
function move(fbox, tbox) {
) y: |. x5 a; \8 @) o' R Y
var arrfbox = new array();
; P$ i. p z/ d# W: a$ I& c2 K
var arrtbox = new array();
4 ~ y# O# x. ~0 i7 K
var arrlookup = new array();
5 h3 }3 E# H: K& b/ ~
var i;
7 J# ^( \: G( }( Q6 C8 p
for (i = 0; i < tbox.options.length; i++) {
0 b. C; Z7 {+ v' T6 h b. n+ ~4 l
arrlookup[tbox.options
.text] = tbox.options
.value;
4 ]$ X& h, k8 }2 z, p% {& R: G( L
arrtbox
= tbox.options
.text;
7 s5 @4 f+ _5 ?
}
- S9 ?: y) P }# ]
var flength = 0;
+ I% x# Y |- g& S& ]) m! t
var tlength = arrtbox.length;
& t$ w7 B" ~' \* J( l1 H
for(i = 0; i < fbox.options.length; i++) {
& i5 S7 | o7 M! p- p
arrlookup[fbox.options
.text] = fbox.options
.value;
; u( l( @. O' ~+ G
if (fbox.options
.selected && fbox.options
.value != "") {
# Z4 u2 A; S: G* W, \( h2 p7 @
arrtbox[tlength] = fbox.options
.text;
2 C2 i# p: ]4 r/ @
tlength++;
" Y# C/ ?* ~ U8 u6 }- j
}
5 q. V" I T+ c5 b$ T& I
else {
) n4 d( |0 Z0 |5 C
arrfbox[flength] = fbox.options
.text;
" S5 _3 H" E; F' E, m U! c r
flength++;
: i- d. C, q I/ I
}
9 E4 N" n* F) Z
}
- e4 r2 k1 z; d8 m5 X
arrfbox.sort();
) d) s% U3 ?- N
arrtbox.sort();
6 v+ R0 W. M9 i' P) A; s% g
3 U1 w! [/ k( o! Y9 Q3 D
fbox.length = 0;
9 }+ H, z3 U; j/ \9 r+ o0 E
tbox.length = 0;
/ I6 p* A8 O3 T7 p
var c;
6 N3 g3 n7 A9 r+ G2 d9 E& l7 Y
for(c = 0; c < arrfbox.length; c++) {
9 B4 l# M. s& ]: U$ O
var no = new option();
3 _0 a* L6 W3 C6 [
no.value = arrlookup[arrfbox[c]];
7 [: |% E0 p A7 _; S, U0 ^* H1 T! f
no.text = arrfbox[c];
$ }' V7 P. `+ Y
fbox[c] = no;
( v4 G5 y$ H0 Y
}
4 J+ D1 a- M# I2 l5 {( \
for(c = 0; c < arrtbox.length; c++) {
2 f& f, r6 l& Y/ _; N) I3 f
var no = new option();
) P9 S1 x5 N8 I
no.value = arrlookup[arrtbox[c]];
) ?& K+ D4 P7 z
no.text = arrtbox[c];
" O1 u/ h7 g. n7 Q
tbox[c] = no;
- o4 H- _5 L, |
}
2 m6 X9 i4 Y" G) G. e
}
8 s3 z1 j# k K- D
</script>
$ Q) R6 L% X1 z* d' I8 w: y
</body>
$ J- ~$ H) Q$ y
欢迎光临 捌玖网络工作室 (http://www.89w.org/)
Powered by Discuz! 7.2
