标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
: U& A) }1 V3 F% @% S B: v' J
c pageencoding="gb2312"
( r. ^9 T4 Y9 p" H6 f/ n9 C3 Z1 V, K
%>
; P$ S# o7 k/ \- [+ J
<style>
( x# h+ C7 `3 Y2 @3 J/ D# `3 k
.f9{ font-size:9pt; }
4 {- m. c3 p$ `+ B: H$ J
.bgc{ background-color:#aecaf9; color: #0033ff }
" r8 N* \8 ~# q5 _+ J. x! E
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
- x: p+ a9 d. z6 ^
border-bottom: solid 1px #4e7dc1;
; ~1 @6 Z( b$ B8 `# ^
border-left: solid 1px #aecaf9;
1 _1 j% Q% m9 | R- a
border-right: solid 1px #5679bd;
8 ^( \5 Y2 [ F1 d; w
padding:1px;
8 @2 [7 o1 D( x8 V7 G
margin:0px;}
- o- q- `: i0 _, b* c- d7 I
</style>
. v9 Y* Z% N% s
<script language="javascript">
# V1 F6 n: s' i# { u% P
<!--
; L9 ^- v1 k2 {9 s, W
function rv()
( u1 S% N! S; y( M; _4 w- r' {3 T$ N3 a
{
4 g5 Q* B! I& W
var val="";
" s5 M- ` L3 g) v( G& [$ q o2 }
for(i=0;i<combo_box.list2.length;i++){
( K( Y) }) D0 r5 J( |2 @5 j
val+=","+combo_box.list2
.value;
( r/ [4 r8 s* j6 ~
}
A( Z: v+ h2 Q0 |6 Q9 E
if(val.charat(0)==","){
" U2 I0 @ b4 P4 u
val=val.substr(1,val.length);
8 J3 u% [) j, E$ ^- N
}
. s5 _2 q& V2 G+ m; w% i, n I! H1 u; A
opener.form1.frecname.value=val;
; h/ @6 ]8 i' T2 L& d
self.close();
% y) r" g1 C: z& W( E2 O" b
}
2 w: q2 \: W6 g* Y" q& X
//-->
1 V. x' H" o# \) T, [1 h! @
</script>
7 [9 h! g+ W9 |! k1 \9 d
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
# J' F! Y) n; s. j6 J
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
A3 }* J7 I3 W* F" f! g$ F5 f- U
<%
% w5 M4 t6 x5 r) L
cdatasource ds=new cdatasource(); //数据联结bean实例
: j1 {( Y# f8 v" m. O; H$ j7 S y
java.sql.connection conn=ds.getconnection();
( e4 b6 k( Z0 F. e6 v6 K1 L
java.sql.statement stmt=null;
& ^! D9 z* u( `9 b- v
java.sql.resultset rs=null;
5 s) `9 j2 k+ r! z! W( z
cdatacheck dc=new cdatacheck();
) F- D7 d" y8 J* |7 c3 f; l
%>
* h- a5 q- o8 f& K8 s
<%
" n; F( e3 |" A6 j/ e" p1 s
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";
& w6 h8 T' R2 ^8 v# ?
stmt=conn.createstatement();
4 ?8 W4 A: [+ b) |
rs=stmt.executequery(sqlu);
" h; W/ y' p! l. i2 t M- z
%>
8 }3 ~# ]% d9 z' y( A- i: b& \2 q
<script language='javascript'>
: h* N) o1 C( s# S H: L# B" a$ P% h
arr = new array();
( y# N& o8 _4 [) h$ {0 d6 L+ J' K
<% int temp=0;
& N2 t' y6 v8 b Y4 j& |3 U( I
while(rs.next())
1 e) K( a6 m7 i0 X9 }' W& D, D
{
7 N4 j( H) d+ l& E: O0 _% Y
%>
/ w4 U; l. g5 S" _* b
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
3 D* O+ e9 \( D; b
<%
& W8 k: y+ _3 D, w& L
temp = temp + 1;
1 S# v- Q( _7 E, N+ v' h$ ]/ j( k
}
! a4 E1 ~/ f1 }+ k
%>
8 g. L: C1 q. i5 I, J; `
temp=<%=temp%>;
0 I7 A8 F& k9 e* ]. R
function changelocation(id){
2 L; c) P, l9 B7 Q5 J
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
) X% k7 f. d0 x/ J q
var i = 0;
" M) A8 l J( d6 B, g% j. w
document.combo_box.city.options[0]=new option('-------','');
' N( X0 C4 t% v9 T2 \9 N
for(i=0;i<temp;i++){
^! Y* }6 D. C) ?1 W' W
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
/ w' R& Q# [& M) E* }6 Z ^
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
! l8 \, R4 l$ L" c- g( W
}
6 Q5 m( \: A) ~7 I& B8 E# ~9 F
}
\9 W0 f7 T5 I$ @
}
% _2 c: `' w) g
</script>
5 i; M/ e3 z6 `6 \( w9 F
; K$ n0 U3 X! y. z) E
<form name="combo_box">
. a K( j+ s3 Q
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
/ w, h7 p# r( f7 d% X
<tr height="24">
) H& S* j% ` l, z# b- k6 C
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
% S! G& p3 Q; C& E7 @ {
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
2 G3 ~/ \1 U: c+ n
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
" x8 i: D. |6 P( @1 T
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
2 }5 K2 Q2 i( Q/ z
</tr>
1 E/ z- j- p; W! \. w) Z4 a" u
<tr>
# K1 q5 V% Q8 |2 U# Y3 ^- W4 j$ Z
<td>
( M: u0 Y) e- z! O g
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
( k1 }+ l( n. [9 n2 C1 l! m. y2 V
<option value="0">请选择部门 ---></option>
$ e) R/ @) X; O2 X
<%
1 q Y O/ @* d8 c" I0 Z" s
string sqld="select * from tdept";
. T. A S! e7 k# o3 R4 j5 O) l+ f
stmt=conn.createstatement();
; }. |6 _& n. ]$ B0 Q, {- ^
rs=stmt.executequery(sqld);
* p- ~* e9 B; ^2 S7 N
while(rs.next())
% D$ M3 Q8 H8 u& y! H
{
. v7 d6 z3 ]0 f1 H0 F" w$ c' C. }3 L
%>
4 Z% `5 |7 R4 t/ ~+ ?- F
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
4 {: M$ _# @3 `2 D: V8 M, w
<%
+ p9 l T2 G5 Q, u
}
1 K5 m' E3 `7 |. x+ `
%>
: c' h5 v- T; C
</select>
! b1 g6 M& P# b" M
</td>
: c/ o2 a2 A8 r; h
<td>
; k+ C; U }' A5 T6 b( |& i
<select multiple id=city style="width:150;height:200" class="bgc">
* T u' Y2 a0 b
</select>
0 i3 p0 ~ d- P8 D2 I7 Y
</td>
+ O- u: D8 }4 X; I
<td nowrap align="center" class="bgc">
- p' g1 t( Z: D0 |' `9 s- f
<input type="button" value="<<" class="buttons">
6 _' {# U% G0 F0 ~4 g, [
<input type="button" value=">>" class="buttons">
7 {" R" L( g1 [' `
</td>
, B4 L: C2 J" H! U5 v- ~4 M8 |
<td>
& w% C8 ~) J0 D9 ^0 n# D# w7 q3 r/ x
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
+ i9 b, S3 y b- d r$ f! I
</select>
4 _& K7 l- M k3 X/ w5 G6 d6 o2 D
</td>
) L& n7 T$ V$ y$ w+ F+ A
</tr>
5 B9 a. b) I' C) N/ E1 c
<tr class="bgc">
9 d5 J G/ P- s! E+ ^0 u1 V
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
, }& J0 \/ P2 t% P: H
</tr>
" W0 a; B# ]! Q
</table>
p7 B4 v7 j( g( w! w( T
</form>
) G, Y. ]% g6 y0 i& R# v5 N
<script language="javascript">
/ U4 d* u- g! o6 |( ~
//人名移动
& D( Y2 O# }8 a% H0 x% T# c3 J
function move(fbox, tbox) {
, Y4 p5 x2 a* R
var arrfbox = new array();
# ^# D" v( y5 ~4 v) \
var arrtbox = new array();
4 A! U$ P0 b1 {) Q2 [7 L* i- B S
var arrlookup = new array();
1 u/ v9 c6 e. w" B9 B2 _
var i;
( m* o _% f5 b9 _
for (i = 0; i < tbox.options.length; i++) {
: n* {. L. B4 c- @9 Q+ q7 ? ?
arrlookup[tbox.options
.text] = tbox.options
.value;
0 ]# R; ^4 _' D; @0 w/ N" u
arrtbox
= tbox.options
.text;
9 m; ^ v- D4 @; k* S4 H! ^
}
! @1 k$ k) T4 }: [
var flength = 0;
: J w0 n) {* O
var tlength = arrtbox.length;
0 u$ \1 \. C6 D4 R
for(i = 0; i < fbox.options.length; i++) {
; R! s( e8 Q3 y
arrlookup[fbox.options
.text] = fbox.options
.value;
, ~/ H- {; Z: U; q
if (fbox.options
.selected && fbox.options
.value != "") {
4 i5 u2 _( i0 ]$ H5 h' w
arrtbox[tlength] = fbox.options
.text;
+ t/ o* K2 n" f: L) y6 d$ t1 s
tlength++;
/ M& D9 f* W6 e1 j1 P2 H& M
}
8 K4 x4 w2 ?3 k: k0 Q4 P5 l [- O2 ?
else {
* f2 I' W( \/ k# O" H( Y
arrfbox[flength] = fbox.options
.text;
+ } u) @9 y, Z- `! I- ~
flength++;
( t+ n+ H* p' W( B: x! D
}
0 n h C, g }5 J* p
}
2 r" O" I& F% \9 k+ t
arrfbox.sort();
0 E( |5 B4 W- @# E: O
arrtbox.sort();
* f( Q, f) m! m
/ Y' O" _& o( h, D+ p1 |+ V3 n# E) A5 p
fbox.length = 0;
* D% Q# r: n; ]2 S- `$ G
tbox.length = 0;
" N( V, f; X2 @0 w- a, g
var c;
1 [: j: M, I9 y4 I v
for(c = 0; c < arrfbox.length; c++) {
+ Z: m- [7 @, k2 N( ^& P5 M9 F$ G
var no = new option();
6 D" l3 P$ q; d+ Q1 _% @ H, ]
no.value = arrlookup[arrfbox[c]];
* N& Z% G9 N$ v+ D" K( u+ }+ h& F6 l
no.text = arrfbox[c];
3 J, g% y4 s& B1 w
fbox[c] = no;
. R1 r+ Y7 b2 D8 Q+ f3 K
}
6 ?1 P) J1 ~- E u- N) i% n' c; P4 a
for(c = 0; c < arrtbox.length; c++) {
% r7 p; G0 e q, p$ ~& S
var no = new option();
) S8 I$ f, L! z/ w
no.value = arrlookup[arrtbox[c]];
" e0 q C; `2 I5 Y6 l
no.text = arrtbox[c];
2 }" O2 e* R. K" e( J1 V
tbox[c] = no;
; B* C1 X( `+ _% T3 J( S1 i! z
}
w5 |2 q3 b3 U
}
& D7 H# y2 c) e, H$ }
</script>
* S/ A# i7 r& }4 u' F! D! R
</body>
+ a. ^$ @$ F8 ]2 j, p d- R
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
