标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
1 g2 G+ Y$ J2 ^/ w3 o( F% l
c pageencoding="gb2312"
# i9 i5 B) p9 g, e' P& U7 @, g
%>
+ o% I" r& a9 L: h R
<style>
* s' y) Z2 i# g4 G% L$ h( z
.f9{ font-size:9pt; }
( ^5 w& D8 ], ]# ?
.bgc{ background-color:#aecaf9; color: #0033ff }
/ v1 O2 {2 y: R. A6 S7 w
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
; A) C. d4 a# {. ~0 r" N! Z- I
border-bottom: solid 1px #4e7dc1;
) u6 E! q+ c( n A0 z
border-left: solid 1px #aecaf9;
/ f _. Z4 J) g4 w; B- ^0 |
border-right: solid 1px #5679bd;
6 X! z0 C% s5 w6 q2 S2 d
padding:1px;
: E& B/ r5 A+ M2 v# n5 @% N
margin:0px;}
5 u3 l5 Y" v! Z9 m5 N$ g
</style>
3 W! f- U7 j* _* t- ]7 {+ {/ G1 J
<script language="javascript">
3 ]" Q1 `& s6 }/ N1 {
<!--
! p: J4 J% J2 `
function rv()
5 t5 v' |1 D5 P2 P7 _
{
# h$ o, L# l3 C7 j
var val="";
* S$ M/ a& _. h7 C$ S. d
for(i=0;i<combo_box.list2.length;i++){
0 p7 F' h3 A2 l2 x
val+=","+combo_box.list2
.value;
, n( q: ]. Z9 B3 c4 b$ y) `9 r
}
3 A5 R# f9 ~- {& S2 x2 E4 k$ p
if(val.charat(0)==","){
6 ^# u. H1 D' I
val=val.substr(1,val.length);
& q+ l3 s" S9 d" H4 X* A F
}
5 ?+ W( B2 ^9 q/ }2 w' a, v* m
opener.form1.frecname.value=val;
! U. a6 S) h Z" M0 S z" N4 H& S
self.close();
) F# p! L+ O; S8 f+ |/ u; Z
}
8 ^8 Z# f8 Y- J5 y; N4 M# @
//-->
& M- h2 l5 @, |
</script>
4 V8 B" J" q! I- w2 C# G' i
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
0 P1 ^" }" c/ ]) |3 X$ q* V5 N
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
; Z( C$ E7 h0 s2 U6 k
<%
7 \& A! M; Q* ^- u3 T
cdatasource ds=new cdatasource(); //数据联结bean实例
( N+ v1 c6 g! d s! k- }! l
java.sql.connection conn=ds.getconnection();
3 S Q7 ?# j* E4 ]. i! o
java.sql.statement stmt=null;
+ O- K0 j# y! e/ ^* {* Q
java.sql.resultset rs=null;
" i4 s P. i$ o. W
cdatacheck dc=new cdatacheck();
! p a/ A0 o2 }- X3 ^. S
%>
4 @8 {0 i; T. l2 G% J" t- \
<%
) F# b: g7 q/ c' \
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";
5 q+ g% A1 L$ B- M: W2 J. F% I
stmt=conn.createstatement();
Y; h, f- |# x3 X4 s4 o) ]
rs=stmt.executequery(sqlu);
: r8 Z, y/ H& n4 l/ J
%>
9 b* E0 G# c' S' ]; p5 z
<script language='javascript'>
' d' z9 P# x [6 F) U3 S1 g. O
arr = new array();
( g! D8 r# V; a- x$ v
<% int temp=0;
! K# R- F- f, L6 P2 M% f2 g5 K
while(rs.next())
" p" B8 Q, Q: f. B$ H, U
{
7 Y& M. r6 }, N9 i2 o
%>
3 p; j; ^' R4 f2 u
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
5 p6 ]$ R( C2 Q5 A4 d* j
<%
" |2 ~, F( z) I' g$ V8 W0 E! d' T9 \
temp = temp + 1;
4 S6 W. m4 l3 s E% k; N( _
}
: f" w4 K! ?! B. }
%>
3 H' R+ c" [9 {- E) ]6 x
temp=<%=temp%>;
c8 { n% E2 w9 `' F& {
function changelocation(id){
1 I2 J" V( \, \
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
* g, | I/ Y: g; J- S2 \9 v/ ]
var i = 0;
; e7 ?) c' F0 q2 R: a: _; i
document.combo_box.city.options[0]=new option('-------','');
q3 t5 U7 ]0 C: {1 }; @# y* w
for(i=0;i<temp;i++){
: ?, d3 {# `, L1 {
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
: J' E# j2 k, X
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
4 {. a/ C+ |; K; W; ^
}
5 T/ U( G/ v% j" E, v3 t# j
}
. E* G6 b4 S' u, n" T: d
}
- z4 v* B i% n" l
</script>
; \9 ^1 L0 D- n7 y
/ V; K8 U' f$ k2 g( d- c, I
<form name="combo_box">
3 p4 v1 i2 D5 |
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
* F" y! `" d* }0 @
<tr height="24">
' B0 d& J' n+ t# ]! e6 t% a
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
! i8 c# L; Y, A! [$ t" |
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
' ~4 `% E* l3 j l* Q
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
3 n7 r- M" i9 `# g' e! B! L. r) f5 }
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
* y R z8 ]8 f5 T. R/ F
</tr>
X6 s; Q i. H2 i
<tr>
9 A9 q! }7 _$ k* }+ m# v8 N
<td>
6 `0 P2 u3 w; ^6 R5 ^0 Q; a6 Z$ C
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
" R+ f3 c" C2 Z" c6 C# B
<option value="0">请选择部门 ---></option>
& k, E6 [7 q7 {% {6 d
<%
' U' x+ \2 k* o: I0 \
string sqld="select * from tdept";
! b2 ?! m* D+ d m, q* o. B2 b- g4 @
stmt=conn.createstatement();
" Y) H# ?$ O5 Q; M: D. h% l# J
rs=stmt.executequery(sqld);
" G5 D9 B# g4 [8 k) @$ Q4 z
while(rs.next())
6 v# ` g: g& ] \1 N
{
6 a: K. s" L& `# M; B' D
%>
( X7 B* ? @7 k$ ?" V5 z7 c2 i
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
- T0 i( W- o: h
<%
" q7 B0 v1 K( Y: b
}
! b$ \8 g6 \4 d/ {" p) i" e6 w1 V0 }
%>
1 G. @8 J Y ~
</select>
9 `5 T9 N. d3 i5 K! M9 Z- L# O X$ v
</td>
2 D) v% ~6 \0 {' W5 q
<td>
2 z2 h- D8 v5 ?# U3 N$ l r& U
<select multiple id=city style="width:150;height:200" class="bgc">
5 S! p& U4 |, l1 d- ^, a$ ~
</select>
5 }. V6 |% ~+ O$ A4 `. f" B
</td>
+ n9 I4 ~% T7 I5 [; J3 n, c: G' T
<td nowrap align="center" class="bgc">
6 n: k; \9 q+ ^- t$ N
<input type="button" value="<<" class="buttons">
0 @1 |: s, G4 w( U# o4 c
<input type="button" value=">>" class="buttons">
- x8 B( f) M: _! A: Y+ I# p! z4 Z
</td>
" h* |# O3 E2 R+ f, z
<td>
% A+ q( f" {1 x7 T& w
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
' m6 G7 \' ^4 Z/ _6 t
</select>
x- A+ o0 ~% L; O' }+ X
</td>
2 j$ s/ z- l' ]2 g6 L" q( l0 K
</tr>
- A5 V, C3 I! v5 T5 E# i
<tr class="bgc">
3 m, V- L: Y# W$ E* y# }6 N7 A
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
* Q- u) I# s* m* r' `+ t6 J
</tr>
7 a' J, l- S& o2 T6 `
</table>
7 I( `9 ]0 [- F: ^, Q
</form>
, ?' @3 j) ~" v' p5 L: R
<script language="javascript">
$ O9 W I0 l9 _3 S$ }+ p. A" w
//人名移动
" M0 K2 \% B9 c$ {" w0 N( Z; ]
function move(fbox, tbox) {
7 R, @4 B; E& ~' k2 Z
var arrfbox = new array();
0 [2 i6 Z% {, f5 T/ N. j
var arrtbox = new array();
+ t0 U8 k0 O- r9 `2 ^0 T
var arrlookup = new array();
1 A- e% I* r# d; y m3 b3 i' b8 b
var i;
, X8 X, I# O0 r8 ~
for (i = 0; i < tbox.options.length; i++) {
! T" W ]; E# N- U' q0 A
arrlookup[tbox.options
.text] = tbox.options
.value;
8 ]1 Q' L0 F4 b9 @& [
arrtbox
= tbox.options
.text;
. J, O, I4 V( ^) w
}
0 e( ~& [) S& U, }
var flength = 0;
Y/ y$ }2 ^/ \/ N6 M
var tlength = arrtbox.length;
! Y) [; @ K6 q$ y5 q3 P0 |1 Y
for(i = 0; i < fbox.options.length; i++) {
9 R" I- }' m) g# ~8 b0 z: _6 Y I2 @
arrlookup[fbox.options
.text] = fbox.options
.value;
! M! [! F- n# h& X3 o. L9 P
if (fbox.options
.selected && fbox.options
.value != "") {
$ o$ ?: [1 r$ l1 u' H
arrtbox[tlength] = fbox.options
.text;
: ?: u" e$ O- L% J6 L s
tlength++;
+ ~: T: y; B/ x& w" U
}
0 O5 k3 B7 c; ?6 q+ w5 C3 V8 k8 L
else {
# R, c# F( I' ^ X( u$ z3 G* d4 }
arrfbox[flength] = fbox.options
.text;
. d; N, o6 n3 C( ~+ i2 i
flength++;
7 p' u6 t3 r5 F y8 ?
}
. o% o r8 g Q& J3 `, m
}
9 ~7 t5 T$ N: r: S1 Q
arrfbox.sort();
. X1 @( ~5 }6 n# r# m. g% u& d/ r
arrtbox.sort();
% w! T2 J7 Y+ J9 ~# _5 Z$ j
$ c; P7 L- n- s7 R' {
fbox.length = 0;
% K0 l! S. i) d# U( h
tbox.length = 0;
# R7 w' L C9 K0 q: a$ v% h3 K' K
var c;
; N6 b1 e8 G+ i
for(c = 0; c < arrfbox.length; c++) {
3 A. W0 P9 u* D6 |8 G8 b
var no = new option();
9 D0 F0 }5 K( _) N5 [& p
no.value = arrlookup[arrfbox[c]];
$ V+ Z; ?! R. c; B9 Z
no.text = arrfbox[c];
2 ]' a8 A/ n' W2 N1 [# g# h
fbox[c] = no;
' L- x) Q9 a" F, v& X& C- U
}
2 b! s6 e6 T$ S7 K1 b* t& ]
for(c = 0; c < arrtbox.length; c++) {
$ F, m2 F' F9 p1 `4 y0 `; P8 E
var no = new option();
, ^8 j& U% N; l6 f
no.value = arrlookup[arrtbox[c]];
* b' t" S u8 k! n2 {
no.text = arrtbox[c];
. [1 r4 Y& B. y& {* F& R. ]# m, v( P
tbox[c] = no;
, l: x/ }; m/ S2 T
}
# q+ u3 N# D0 i* b P" a( U4 u1 |
}
) a7 @$ O6 s' d7 A { R9 B7 [
</script>
1 u- H& D6 G# }
</body>
1 A% `4 I% Y( s7 c
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
