标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
& [$ v* o y0 v; F6 \3 Z/ m
c pageencoding="gb2312"
0 x6 Q$ R C) [/ Y
%>
, {- v @! j% Z `- r3 x! u
<style>
, b3 v! j3 I0 Q; ?; A
.f9{ font-size:9pt; }
0 t3 N* j4 y4 C! e/ y' {, g4 S7 [ A
.bgc{ background-color:#aecaf9; color: #0033ff }
5 s2 y5 k$ v( X- v' J, q7 G! v
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
0 }7 \1 ~& Y. Z/ J
border-bottom: solid 1px #4e7dc1;
) F% T: ^! K' X4 D3 B! J! M
border-left: solid 1px #aecaf9;
0 d( t/ `4 ]! J0 g
border-right: solid 1px #5679bd;
0 \1 x' f* b% o( u- B/ m3 Q# Q
padding:1px;
, I7 y7 i5 Z* E2 y* L, o8 A8 ~
margin:0px;}
9 E6 \3 Q9 i/ Q. D
</style>
1 `) B2 ]7 b( ?! N' y7 t: R; H
<script language="javascript">
& d# w# J3 a1 k
<!--
0 e1 Z7 E/ Y) f3 k2 ^
function rv()
- g! p" P$ q6 x2 [/ U0 Z
{
: V% E* o& @2 d- k+ O* ] D
var val="";
) r. c, t- b z+ ]
for(i=0;i<combo_box.list2.length;i++){
. N! v9 M; y! L V; W0 `4 w/ x
val+=","+combo_box.list2
.value;
h5 Q! C% b8 t! _* ^+ w
}
; T# N" }* P9 `4 Y: d; t: H
if(val.charat(0)==","){
! z/ k2 C9 I$ n% B9 }- E
val=val.substr(1,val.length);
2 M1 p1 A3 v3 l
}
! Z- |3 L: y1 E8 Z, X7 r1 m
opener.form1.frecname.value=val;
# Z/ b" w$ m+ h6 J6 D3 w% Z5 E+ p
self.close();
- a5 W. |5 D3 `0 e
}
- o4 U+ `3 g+ f: R: }, N( k
//-->
z' d+ O6 c- K0 C
</script>
) W4 A, B, [8 ?/ z. x
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
+ {. P6 L& Q, K) i5 m5 v$ i+ _
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
6 f! ^ B8 _; o3 x
<%
! ?4 `0 F3 P) @0 I
cdatasource ds=new cdatasource(); //数据联结bean实例
# M: w: o7 m3 V
java.sql.connection conn=ds.getconnection();
0 n' I( e0 q1 c) z
java.sql.statement stmt=null;
! F* Z% t8 B3 _ Z
java.sql.resultset rs=null;
" c$ S1 ?# \# ]9 B b6 ^# ?$ K0 {4 W
cdatacheck dc=new cdatacheck();
/ P, D( o. z- _- G
%>
* Q; t; E7 m# g2 \" w+ p- j! E* o7 N
<%
/ q2 f' v# P6 `. \
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";
, p/ r1 t% ]! R; O0 f5 E
stmt=conn.createstatement();
6 ]/ O1 |& ?8 h
rs=stmt.executequery(sqlu);
% B0 v) H7 A# e* y, A' t
%>
& c: n* u+ i! S2 R4 `$ Z
<script language='javascript'>
% |# I& l9 k4 P: F% C( w
arr = new array();
' o p/ T; b' s2 D
<% int temp=0;
7 R$ F; c) p. G, @2 A1 H0 ?
while(rs.next())
; a& D# M+ ^4 ?7 E/ j3 _% }1 \
{
& Y) o$ q* D4 o2 x2 X$ m5 A$ ]$ x
%>
3 |. L) f/ \6 A' f2 S" D0 Z$ ^
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
; Y# }9 f2 k& W6 E+ I; D3 c
<%
" y* h; m' r* y$ |/ a H
temp = temp + 1;
2 r: B. }# g5 k
}
( k! x$ d! }7 O7 O
%>
) D/ Z3 [5 y& s7 D
temp=<%=temp%>;
" G* Z2 s3 Z$ F9 ]( w9 O
function changelocation(id){
# J U& u, W/ A4 _6 L' @
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
( G2 n( V U3 k5 e7 C! B7 j0 D
var i = 0;
0 ^3 d5 x, |4 [. x: e9 @* S
document.combo_box.city.options[0]=new option('-------','');
( E" D% ?* d& |7 _
for(i=0;i<temp;i++){
7 J8 V/ ? {0 W& J. \4 Q2 z
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
2 E. Y6 Y: i3 _+ [& Q
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
9 w6 M5 T( D# ~. m
}
* Y$ j. Q; S5 u! b$ P
}
! `! Z/ e ]# g! W/ Y7 G
}
4 ?7 |' S' D; ~& a; L6 E7 `, W3 P
</script>
5 V) z+ q t: g6 x. ?
6 g: o" F* j$ T+ t' D# l$ w
<form name="combo_box">
' K% `* Q& p% s
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
6 O# I1 ?4 L/ s( w7 v6 G" f
<tr height="24">
6 T5 Y% s8 d" H! t- J
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
2 f) E3 E& u+ u
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
9 F2 K# D; M f& C! M
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
5 M) y; J6 S2 O8 A# G5 V5 ?" Y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
% [6 ] i0 G4 x4 Z' U
</tr>
1 c8 r0 ]7 N5 d! c& P
<tr>
% x7 N: J9 d9 N) e
<td>
5 X ~( U/ F5 y$ T/ Z4 s+ p7 H
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
8 k2 @: Z' q4 o1 {+ D3 r; q
<option value="0">请选择部门 ---></option>
0 W C e) q0 t! S# n$ _- J; q
<%
0 b- ?8 Q# k: j' V1 k$ W4 z9 l
string sqld="select * from tdept";
% n+ `7 w( ^: G$ Y/ D/ H9 j
stmt=conn.createstatement();
: t5 s, X2 L4 D' s7 X% R
rs=stmt.executequery(sqld);
" L& W* F I7 Q6 n: F$ k* |& B7 A
while(rs.next())
9 \8 I: h7 d( p& A {; w
{
+ ]* o6 H: F6 [5 e
%>
7 ]2 v- c9 q4 m9 b1 `3 I$ z1 @- U
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
1 X ] p% C+ v; E1 m: F3 e
<%
z& _2 @9 O( C3 b6 ?8 M+ |, }% l( G
}
' @1 y" N0 V; R d
%>
/ `" _7 {3 l9 J1 Z# F2 i1 g
</select>
8 N4 X5 ^ c) T8 a( ~
</td>
6 a* {: N7 s3 o
<td>
7 Z/ m5 p R3 O4 [0 z Q
<select multiple id=city style="width:150;height:200" class="bgc">
, M* X& y# t: j5 [4 u
</select>
6 ^2 P. Y- E. ^9 V+ h
</td>
- V( C; t$ B# V! t1 G: _3 u
<td nowrap align="center" class="bgc">
* z' j) g4 h x* X5 F$ \
<input type="button" value="<<" class="buttons">
* j) E# h' S7 S9 Z
<input type="button" value=">>" class="buttons">
( b* x" b6 @1 o. l, d5 d, }1 p
</td>
+ @' v' y0 i* N" U) V& h
<td>
j4 F. ]2 u3 D6 _ I9 I- L
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
4 T& {) a/ f: e+ D" F/ x& R9 ]
</select>
7 Y. c* X! f/ U; D) R% v
</td>
w" f+ p1 `4 o
</tr>
2 L. B9 W9 X6 | B
<tr class="bgc">
9 J" b! M! V: ?1 U
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
+ u3 I0 R' S& `- B: {- d
</tr>
0 p" }+ ~3 @# G9 J' |" P' o9 v
</table>
0 c7 g, Q) K4 H3 E2 f- |
</form>
, ?/ e' Y( G6 x3 z7 i3 q; R3 A
<script language="javascript">
. E, F2 R v9 F4 h/ u; I" \! C
//人名移动
4 o' E+ v7 I% G( i3 H
function move(fbox, tbox) {
9 g+ \- f E( ^( g
var arrfbox = new array();
' @2 h0 Q/ R' g3 o) K9 e
var arrtbox = new array();
" `, O, s' A5 I& @+ }0 C) Y
var arrlookup = new array();
) {) h7 p! L8 ]$ W
var i;
1 ^0 m* y5 t, S, q P% N( O
for (i = 0; i < tbox.options.length; i++) {
+ z) P4 D4 e8 k8 f. ?. T
arrlookup[tbox.options
.text] = tbox.options
.value;
3 M9 f) T) |$ V: O( N0 c4 G0 a
arrtbox
= tbox.options
.text;
" w' D# j* F. V; a+ I
}
+ t9 X `! w1 \. K/ ]
var flength = 0;
" n% L& C. d. J4 [
var tlength = arrtbox.length;
3 d, F2 ?1 c( ]; r% t- U
for(i = 0; i < fbox.options.length; i++) {
! t: J4 k0 G" F' I
arrlookup[fbox.options
.text] = fbox.options
.value;
: C! i' ]3 K: O) K" m
if (fbox.options
.selected && fbox.options
.value != "") {
1 ~$ T* j2 j3 V& w
arrtbox[tlength] = fbox.options
.text;
2 s# F! P9 T+ u% t$ I
tlength++;
8 \# }4 b; x7 W( ?1 y/ K) l+ u- h
}
" n) O. f6 l4 v
else {
5 D* \ a& ?: [* ^- B
arrfbox[flength] = fbox.options
.text;
8 N' w' Y# g5 V7 Z0 b- \
flength++;
; g9 E, y! X& X3 c* M4 b
}
8 M! Z' i7 a7 ~% |( a. o% L
}
7 K* P) _+ g, i( V, | m
arrfbox.sort();
1 G4 g0 @+ Y+ x+ J) G9 n
arrtbox.sort();
8 F% h) A5 U4 H
F- B& s# i6 ?6 K6 m' k! m8 G
fbox.length = 0;
6 s6 B. {0 w% \! R' D2 e0 `: Z
tbox.length = 0;
! n9 n" i7 S4 B9 U7 n4 U k6 [& N$ O# R
var c;
' I o# Z8 L* h/ w
for(c = 0; c < arrfbox.length; c++) {
% o& m- e. g" p5 N+ Y
var no = new option();
9 _( K, m) ]2 k; D# G
no.value = arrlookup[arrfbox[c]];
$ M$ [5 @7 b! v6 t/ j' H
no.text = arrfbox[c];
/ v- \+ \% `, X/ B2 R2 o) j
fbox[c] = no;
5 ?4 L. p% U- F" q4 E& u) N
}
% p/ @) _8 ]8 s+ m7 p5 N
for(c = 0; c < arrtbox.length; c++) {
/ N/ s8 @. i$ g7 ?
var no = new option();
" c* e i0 z4 x, [* I2 Z
no.value = arrlookup[arrtbox[c]];
: F8 l g1 { e, [1 l4 _- \
no.text = arrtbox[c];
3 }5 @# E" b' _4 \. h
tbox[c] = no;
! ]* i" j: K% U7 d
}
4 `! O' r# m/ _8 I2 L0 D; F
}
I9 n. D- v5 r! t- I: k
</script>
( D, d% [' X) q. R4 d
</body>
$ }$ B5 h5 A$ w
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
