标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
. |9 z$ ^7 v k8 f; C
c pageencoding="gb2312"
& o2 z8 U- T4 G) p7 u# J S
%>
1 ?8 e/ V4 ~. n$ l9 h' ~& b* F
<style>
1 y# i5 X+ v! O$ O4 v) i
.f9{ font-size:9pt; }
4 A% u$ O& w4 W* B0 n! N
.bgc{ background-color:#aecaf9; color: #0033ff }
7 g. G- Y% m0 p( W: V+ Z* |* A0 [
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
6 i- _% ^( I2 v3 o
border-bottom: solid 1px #4e7dc1;
\% w F" }$ `* ^3 q( H) q' `4 `# E
border-left: solid 1px #aecaf9;
1 b/ I* ~% Y9 K$ O% F$ f! Q
border-right: solid 1px #5679bd;
. [$ R' B# ^0 G4 z! }
padding:1px;
1 l8 R6 p3 D& z. W1 z7 l
margin:0px;}
5 i; `9 ]' V# H( u
</style>
; D9 |- n' _; t
<script language="javascript">
& M& D; n) m# k
<!--
4 m' Y0 C- n; |3 x8 }: s
function rv()
3 r8 T! ~, ~6 }5 R2 E3 I T
{
5 o( r) f6 F4 l+ l
var val="";
4 z7 t6 [6 u8 [3 G5 ?
for(i=0;i<combo_box.list2.length;i++){
$ f9 G. _# r3 Y2 A
val+=","+combo_box.list2
.value;
. I: o, A" I3 w: ?0 e
}
; W% ^' |- D4 f. `$ j: ~
if(val.charat(0)==","){
; H" {5 U; j" C& J6 @
val=val.substr(1,val.length);
# W+ U d1 J. c- u0 I) w- A8 g
}
8 i4 I+ q. y" D% Q
opener.form1.frecname.value=val;
8 M+ A) C6 w) t5 ?$ N& E! N! s) g, q
self.close();
4 l+ y$ C6 n7 E: q
}
8 m2 D3 E, }7 W
//-->
- i9 x/ ], | ?/ @! N9 R2 R
</script>
3 G" P* }# E+ V, M
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
3 e* D$ G9 B! ]" h4 d: E* E$ s: ?
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
, R; |! o) p% i2 P7 D' S/ ~
<%
$ l+ \1 ~: D# v5 G( P9 l1 X
cdatasource ds=new cdatasource(); //数据联结bean实例
2 e0 |1 k2 }- \: Y# M! `" ]; _! v
java.sql.connection conn=ds.getconnection();
% f- J6 j, v! i2 H) B
java.sql.statement stmt=null;
& D& O4 s- ^8 @4 r e+ ^
java.sql.resultset rs=null;
4 Y) H0 e8 o" u1 u& |7 y7 w
cdatacheck dc=new cdatacheck();
/ k4 F! O$ N7 |% Y) N- u0 f/ ~
%>
( F3 _' w' g1 [8 O
<%
' O2 p% k# z1 U4 R7 r, _7 ], K1 x
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";
, v8 B( C% N R+ v. `2 Y# E
stmt=conn.createstatement();
" f$ z: G; ?, L+ ~6 a0 N
rs=stmt.executequery(sqlu);
1 K3 R$ e3 `( R ]. v M2 X
%>
/ A/ a4 k4 B0 J! x$ D
<script language='javascript'>
6 s- d3 W, n" \* [) ~/ o$ v
arr = new array();
' j) l' Q5 L9 W5 Y# j$ E) @# l
<% int temp=0;
/ X: ?# z4 E* L6 y V7 l% ~' P7 K
while(rs.next())
, f* w2 A" {. f5 z6 C. q, D5 n8 y
{
2 r5 ], Y3 K( B' q3 Y
%>
) M: W2 f- h) B3 B# R
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
5 e0 K' Q" q1 r
<%
7 p# J9 I- U* @ r8 c
temp = temp + 1;
( D: k# s- A/ V7 G8 ~! D7 h) P
}
! H3 M# P7 t/ W4 w
%>
7 ]" P$ c! G4 a2 u- p# [
temp=<%=temp%>;
5 g& z% r1 [: Z; Y# j: \
function changelocation(id){
0 I/ G& @- r/ j8 S. P1 Q
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
! f( j, s! |6 X! k1 S# T) n* p
var i = 0;
: h4 T' X/ Q: ^
document.combo_box.city.options[0]=new option('-------','');
: v7 X& x0 p8 ]3 b* V: u2 ?- }+ Q5 p
for(i=0;i<temp;i++){
3 b. p1 p2 Z5 ?1 `# h2 f
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
. W6 y+ z' v! P6 e; ^9 c$ ]
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
( H/ J D9 q$ t% k5 Z/ H
}
+ }) B a) f1 R6 g/ C: f1 `
}
8 \9 N5 p3 @7 Q5 D
}
/ f6 G9 a! a3 c7 ]& G% P# [
</script>
. \6 [# x; {& e( m4 u0 r
" ]1 w. @3 E; U: t% S4 L. I
<form name="combo_box">
* g" e+ ^6 z7 g& a+ w5 X" \2 M
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
' [1 b* p$ g: O9 U6 x
<tr height="24">
7 _* c$ B% P+ @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
' |. J; S6 H9 {
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
5 d- e! f% H& m4 }3 K% \. a' z; ^! c
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
) F8 T" d" n& C5 S+ K
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
7 y/ N; }& h5 x: w, u
</tr>
- v/ u5 g* P. h2 S) T( I: X+ _
<tr>
3 B; ~4 e0 Q$ n1 [
<td>
) O9 B2 J: O4 e p/ C1 m$ a
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
# D+ F) W( O0 g O7 e$ I0 F
<option value="0">请选择部门 ---></option>
) S9 Q6 R' X$ m0 p$ l9 w' [& i
<%
' K5 I6 s( Z: }+ p) ?
string sqld="select * from tdept";
1 F0 K: m* g1 C+ b4 ]& p$ D: |8 F
stmt=conn.createstatement();
4 C9 b0 G5 q. O" S# `
rs=stmt.executequery(sqld);
0 b) I. f! h% C# c
while(rs.next())
' T' i' t9 S: W* w Y/ N
{
5 D5 c$ V- [; `0 v7 e
%>
" K, [; ?8 T9 |0 x
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
" T: C; R$ ]# [% M. `) o$ ?. t. ?
<%
. x0 [6 a% V2 H* O
}
1 @9 L8 b j! \: ^7 i
%>
1 P$ x9 d [: q. `: N# G& X
</select>
" ?* u' M: {% j% K. O
</td>
; T! d7 n( w, P& r
<td>
, D2 A4 G1 I* _, K1 h- p
<select multiple id=city style="width:150;height:200" class="bgc">
+ `6 p* _8 O9 j/ U, b& ~
</select>
, }, V0 ~$ `6 w5 j8 n
</td>
9 |2 V9 G6 U7 J! O6 `, b1 R& c
<td nowrap align="center" class="bgc">
; v g' [4 G' B$ m- _& h& o9 }
<input type="button" value="<<" class="buttons">
2 A! D+ b. C* S9 }+ Z& S/ L
<input type="button" value=">>" class="buttons">
" W0 B/ f( _6 t3 o2 E& h% a1 ~1 ~/ y
</td>
' P' K3 m4 N. a4 Y
<td>
% E+ }. K8 g8 R& x9 s0 V; Z
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
6 n; H7 l5 |# d2 J# O
</select>
/ O* o" ?! h+ M- K9 g+ W9 O/ Y
</td>
& K( \" W% j; B2 D
</tr>
- B5 ?2 u3 J1 Q S& `3 s6 K
<tr class="bgc">
% l0 M" u+ n. L
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
5 T0 g7 b" W$ N
</tr>
- Y. a/ q2 T+ l
</table>
' x" s& `5 N, L7 ~
</form>
, @1 T5 M$ K0 B* A& ]
<script language="javascript">
4 m9 ~/ O; W: a3 Y
//人名移动
9 N- D, R- S% c5 Z! ?! Q* ~: j% O
function move(fbox, tbox) {
1 Z, {+ a" P8 T. e
var arrfbox = new array();
: S0 @, e; W; d) [: J
var arrtbox = new array();
; R" n2 u1 g) {
var arrlookup = new array();
; M0 a; k6 |$ l Z. i
var i;
$ i, }1 y+ l! V$ m$ o- a
for (i = 0; i < tbox.options.length; i++) {
- |9 n7 E F& b5 o& o8 I7 j
arrlookup[tbox.options
.text] = tbox.options
.value;
: \# j/ Q7 s. R8 j# V
arrtbox
= tbox.options
.text;
( V. m( ]- `; ^- @/ P) n% V
}
# h' x9 q' V# |+ y) k) ?8 C4 m
var flength = 0;
% j# a: e6 Z& K
var tlength = arrtbox.length;
5 z. B' k' u! Q
for(i = 0; i < fbox.options.length; i++) {
) ?& }$ I+ g' w) y- {
arrlookup[fbox.options
.text] = fbox.options
.value;
) E! Y% _* y9 s' G0 X# j; Y) _
if (fbox.options
.selected && fbox.options
.value != "") {
% }9 B6 \' C- C/ m6 ]: x7 ^
arrtbox[tlength] = fbox.options
.text;
7 F: {# R {8 {/ g
tlength++;
1 x; e4 |! d5 S3 Y- Y' d& B
}
2 M' R# h5 K0 n8 Y) `, l: h O
else {
! j2 ~/ q# y( M! \2 l
arrfbox[flength] = fbox.options
.text;
: N' F% N! o% F) T7 l8 P5 a, W
flength++;
; R- n& [: ] o; N7 o, b
}
/ B# y, L0 S8 o( T+ W0 g
}
$ I5 A G7 M4 @) V3 `
arrfbox.sort();
7 F9 N* f1 W# w* P. C' ` t
arrtbox.sort();
9 ?% o$ H9 a3 D1 k S0 d% Q" z
( ?; q ]2 O5 m5 {! R- O
fbox.length = 0;
l8 r$ G$ G- y
tbox.length = 0;
8 @2 t; _' K( R6 {* R1 n
var c;
0 B" @* `6 c( D' N3 j) Y
for(c = 0; c < arrfbox.length; c++) {
% N4 n% H7 D% N7 g
var no = new option();
, f% O. f& E& w; h
no.value = arrlookup[arrfbox[c]];
7 ]: @. b9 O, e/ l* O3 A" e
no.text = arrfbox[c];
: n6 A+ c$ y3 N1 t0 L
fbox[c] = no;
7 o2 W1 }* y7 v! v8 r% P% m
}
$ H4 |" x- C# c: N. k4 W! I6 t
for(c = 0; c < arrtbox.length; c++) {
7 P9 O" T1 F* i! z* V; a, e: n
var no = new option();
* _* ~4 _& V$ F! A
no.value = arrlookup[arrtbox[c]];
1 f ~% a1 V# \# ]) I3 _8 ^
no.text = arrtbox[c];
# c- _. V$ b7 {2 D7 r
tbox[c] = no;
. u2 [0 X& I2 I$ E2 B! Y
}
1 T) D1 s. o5 ^9 k- R" g
}
$ l0 ^. y$ ]. a
</script>
: h/ n: ?: g5 Y. z7 X& a2 u1 b
</body>
8 i8 P! x/ R/ q n
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
