标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
( \3 t3 h0 B9 _$ A( }5 @! \% y! b
c pageencoding="gb2312"
8 L1 K9 N% B9 T, [
%>
3 c& G% ~8 g, D6 e" d+ ?/ S
<style>
9 L) h- L8 Q- ~/ w
.f9{ font-size:9pt; }
: a6 T8 K, b/ q' {" e3 e
.bgc{ background-color:#aecaf9; color: #0033ff }
( r& }3 _! J$ D8 y6 M; q# H
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
8 ~8 @2 D. F# Z3 \% ?; \9 X6 i
border-bottom: solid 1px #4e7dc1;
4 H& E' ~- v) M) n
border-left: solid 1px #aecaf9;
1 c9 T- [0 n. X. _
border-right: solid 1px #5679bd;
8 O6 l* ^; j0 n- D) t* \, g
padding:1px;
) z& N: H1 P+ x2 a. v+ }
margin:0px;}
% ~% E4 T8 W. x6 y8 v* B" [( d, }
</style>
5 N! q& d" C" g! B1 l$ J
<script language="javascript">
1 ?- ~' `$ p7 Z5 G; F# E. O
<!--
0 E% |# k7 V/ t X8 g D: ^* I
function rv()
8 y' v- B7 i) a' a9 \8 F2 T' X
{
$ P9 w4 W& Q- x5 ]
var val="";
3 |! }* m8 a {# K$ D
for(i=0;i<combo_box.list2.length;i++){
0 j+ G, k H2 M$ T9 n% s0 p
val+=","+combo_box.list2
.value;
9 O5 W- d0 @* p
}
, N) D: }5 T* ^8 ?1 E4 x
if(val.charat(0)==","){
* b0 Q5 z7 a# U# C
val=val.substr(1,val.length);
7 W) |$ ?( b$ }# s
}
! k7 K& Q M6 ]% K9 J' j
opener.form1.frecname.value=val;
7 S5 D4 }) B7 m7 L2 v; p+ ]3 l; l$ R
self.close();
/ `/ w ]5 w g2 ~, ?
}
$ e# [8 Y4 T8 E+ L- j9 y: l
//-->
5 H, G2 g/ T" D |
</script>
7 r% E% P, l0 a" w& v
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
7 D5 O! v' c9 G
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
/ O- S( e+ Q! K0 y' j) o% R6 h+ ^
<%
& I+ E( j. G: Y
cdatasource ds=new cdatasource(); //数据联结bean实例
: {" ]; J% X/ S3 h
java.sql.connection conn=ds.getconnection();
# x: I8 c& U6 b5 ?( q
java.sql.statement stmt=null;
8 }/ ?+ b; r4 [2 d' z Z* s/ q
java.sql.resultset rs=null;
- `2 G/ n7 C" l! N
cdatacheck dc=new cdatacheck();
) D: k8 ^+ m# B$ |
%>
2 ^) Q/ R6 s$ z- q7 v
<%
+ [: o( m" u! B+ |) x% Y$ v* R
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";
3 ?. O1 r; w. C# n7 E1 C+ R1 b
stmt=conn.createstatement();
- D" \+ W" i g: _8 \
rs=stmt.executequery(sqlu);
$ l* E& h( G5 z
%>
: l8 s6 D# p; g) a
<script language='javascript'>
# {$ }% A/ f0 W. _6 W
arr = new array();
! X2 W( @: s, G
<% int temp=0;
$ P. z7 V# \6 N
while(rs.next())
% v5 G1 M$ n9 v9 p; I! F
{
' j/ @9 m, W0 o( U: S9 u, [
%>
% i8 d* R: W: a1 p' c2 X" F
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
& B0 U: C. A0 }' o
<%
8 B6 e) e* ? o
temp = temp + 1;
9 a+ f) G& }8 Y# w$ T
}
- g$ F" ^6 }6 M/ o6 {$ ~
%>
T! q5 M8 K* b* R8 \
temp=<%=temp%>;
& L# J! W! s5 G# [
function changelocation(id){
2 G! I* t4 N9 z& m
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
0 J4 N& O8 O; J) z5 b
var i = 0;
& b' z2 u& ]1 |$ @( p
document.combo_box.city.options[0]=new option('-------','');
3 A1 _, x* d! d& q: O; c$ L
for(i=0;i<temp;i++){
% U( ]7 W! }% g9 \4 I. m/ u
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
z4 T0 s$ r& Z7 F ]( `
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
' v' S' ? }) w0 K n8 S" o
}
; V$ {' r) ]: `- s
}
% U4 W j9 Y5 `3 q+ b6 F# b
}
$ E8 f: y, i* f* l! L- A0 ^2 H
</script>
* g* i1 r9 g3 }5 p% c
( ?' O5 A1 A% ^( @% n, A
<form name="combo_box">
" x- L; C& m, D% B
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
- e; u2 v) J/ T
<tr height="24">
% f, [' e8 b m! U) @1 X
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
& }9 e; O J3 q4 t" R
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
5 N& R; w3 Q9 O' t
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
3 w& ?- `& Y2 s. @- A
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
+ x& C' j) N7 i2 i
</tr>
! L- n1 F* ^* J3 C
<tr>
* {3 F( e/ h! a7 [: w
<td>
( ~1 ?; n* y% j, L0 m, t# ?
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
1 {; `& e; E# ?# C- A0 z
<option value="0">请选择部门 ---></option>
' M: m% a) T; g* t* E. R5 C# y
<%
. ~/ m. _3 f/ j* |2 r' A2 A8 b7 w
string sqld="select * from tdept";
0 D9 L/ ~2 S% t4 k1 h/ H( c
stmt=conn.createstatement();
' _# _+ q" O1 A" x8 M S2 V" `1 F
rs=stmt.executequery(sqld);
m4 P, @3 S/ Q
while(rs.next())
; m# @* j8 t" l6 }2 G
{
, G6 x+ w. |, T
%>
# { E r2 c$ v( N
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
/ Y; T7 K: v) \% L c
<%
6 O1 N$ n9 U! Q' a1 b! w
}
+ O$ \* f4 X2 {9 Z' P* {% @
%>
: H4 \- I! }' j" r* I. r' y: S
</select>
2 v# U9 c$ F; j: z8 T8 ]
</td>
, B; ^9 t+ [; P! T9 _. O+ x' q
<td>
! @& j7 h# b) j, u1 H
<select multiple id=city style="width:150;height:200" class="bgc">
2 o! [: s# S" x) z' k' b
</select>
9 l) m3 w, a2 x3 z
</td>
& O. B# q( c5 J2 A+ x) I
<td nowrap align="center" class="bgc">
# q( h! b5 T x& ~& s! G
<input type="button" value="<<" class="buttons">
6 N. N- _! a, z) A
<input type="button" value=">>" class="buttons">
' x, ]1 o4 q( a* T
</td>
% f' n% }+ t/ E
<td>
/ g4 Y5 g# b( U2 m
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
0 R5 g* n" o o+ H1 E5 B
</select>
' V3 K. d+ ~1 S3 D9 u- O
</td>
" I) z/ t6 q$ h' g0 X6 Q: u, Y
</tr>
- Z' D" h2 x9 K" C: s) p
<tr class="bgc">
; n1 `' R, S3 _" D4 i
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
5 ~! N) W% v, ^. p8 W7 ?
</tr>
j& B) x4 a7 A
</table>
+ f4 [& E( e! _
</form>
( N9 c. `/ a. x3 q$ Y4 i) Q; ^
<script language="javascript">
1 k2 i* Q- Z7 b
//人名移动
* t& k. Z; f& U: S7 g+ b: }
function move(fbox, tbox) {
' s/ o, s3 v7 `
var arrfbox = new array();
. B- I) {( u d+ e9 e
var arrtbox = new array();
" e7 u7 ]' @: E1 o# a* S0 A
var arrlookup = new array();
' b1 |2 @6 Q" _+ V) p/ G* @
var i;
# g2 I8 ]* y5 B. V7 r
for (i = 0; i < tbox.options.length; i++) {
8 w& M2 S2 F8 p
arrlookup[tbox.options
.text] = tbox.options
.value;
$ k9 r/ K$ `: K5 U2 N8 F+ }* B
arrtbox
= tbox.options
.text;
5 b) I2 t* ^) q# ]
}
( U0 }& u, Y; I2 [2 f0 [/ E! t l
var flength = 0;
) B& \3 q" q* w& N
var tlength = arrtbox.length;
* h& Y% {5 \# C7 R8 Y( l, |2 D
for(i = 0; i < fbox.options.length; i++) {
. j& H2 ~1 R, O0 C' B0 D# E
arrlookup[fbox.options
.text] = fbox.options
.value;
) L9 Y' U6 C- a7 }
if (fbox.options
.selected && fbox.options
.value != "") {
: ?2 M# l* N% `
arrtbox[tlength] = fbox.options
.text;
# z$ U1 f' `; j/ z2 j3 u" r
tlength++;
( l- F9 W9 j: q% o" b4 |7 f
}
0 F3 D2 e( h1 `# Q8 j
else {
# z1 g x3 V& A1 d/ j
arrfbox[flength] = fbox.options
.text;
) K; _( k/ V/ t& H
flength++;
4 H7 r7 C. G2 T! }: ^
}
/ [- M: O/ u. ~: o" u0 r
}
8 G5 o8 n4 d1 W" Z. d" Q. R
arrfbox.sort();
l# Z R2 w* M2 z
arrtbox.sort();
f% I, S% Q' [) ~' E
- `# x$ H2 g6 {* K/ z" w' b, p
fbox.length = 0;
' p( ]- \4 ]/ Z, i' t6 k$ Y$ E$ w
tbox.length = 0;
1 |# S9 V) n( n4 X, f7 j
var c;
8 h2 o! _+ E8 L8 H5 j9 |" M, S" q& f
for(c = 0; c < arrfbox.length; c++) {
5 I- s/ q! V# ^) _" k1 ?4 Z+ l
var no = new option();
5 O- r a; y4 C7 `
no.value = arrlookup[arrfbox[c]];
0 H( O9 c% \4 N0 _% r+ ]) {. e- s
no.text = arrfbox[c];
3 @' z) h4 V8 D. U% G: }* L
fbox[c] = no;
7 l0 w5 |. {2 |* q8 N
}
/ O3 u3 M" z$ {6 U
for(c = 0; c < arrtbox.length; c++) {
. v$ N% Z) ]* @9 ]( v& _. y; Y$ A
var no = new option();
0 z# `( v! r# ^$ c9 A2 ~
no.value = arrlookup[arrtbox[c]];
- t. P1 R M& i' j* F
no.text = arrtbox[c];
7 P/ j! }, p' Q+ ]4 F4 l7 m$ B$ e
tbox[c] = no;
8 E1 r, a9 J6 d/ Q. o& N
}
& @1 W" E! n' H4 C2 E
}
& o7 B$ k" m) |9 ^3 ~. M* d' f
</script>
% L( t0 J+ M& d0 u3 t$ \
</body>
& O0 S' `6 l1 d
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
