标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
' ?! S9 ^4 K0 M B2 h: o, ?
c pageencoding="gb2312"
$ x# u; B3 j' K, l8 ^. c
%>
* A9 ~) d3 q# k O' r. E) n0 @- H8 E
<style>
5 b }- m$ e' g5 p5 T$ L
.f9{ font-size:9pt; }
4 q5 t8 C) Q* h- t, }; G, W
.bgc{ background-color:#aecaf9; color: #0033ff }
$ z. V8 S. }0 E; f$ U% i6 o
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
9 \1 e3 a1 {2 _2 P
border-bottom: solid 1px #4e7dc1;
9 s; W) |5 v5 b4 v5 W+ ?
border-left: solid 1px #aecaf9;
$ V$ n: l. P, J2 I$ v# ~; [
border-right: solid 1px #5679bd;
) O& _, [8 g/ m" S0 t) A
padding:1px;
9 O5 G1 x- Y0 H8 I! A* Q3 U
margin:0px;}
+ l" [$ N& Q8 X s& N( Z H1 @+ Y# b
</style>
! ^0 }* e$ n8 ?5 @
<script language="javascript">
- h- x6 M/ h6 g8 [" r
<!--
2 O2 m+ U: g* o. ~- a
function rv()
9 c) j# _# j. n) g5 P- l
{
1 _" D3 e$ k' B7 |
var val="";
9 `! w8 ]* x+ j
for(i=0;i<combo_box.list2.length;i++){
0 ~& w0 ~1 Y2 R. Y ^! c, X3 X- b
val+=","+combo_box.list2
.value;
3 E }8 C: D' K K
}
) R& ~% p% {. s' X3 d
if(val.charat(0)==","){
0 {6 R) F1 c6 z; K. x
val=val.substr(1,val.length);
% D c& r: z6 b# G2 i# `6 h
}
# |2 G t: a9 \# l! y
opener.form1.frecname.value=val;
- [( G; U6 `6 z) h: c+ z( @/ L
self.close();
* v3 k# w+ v. N2 A& N5 N
}
9 ~3 C- K4 q% q% ~
//-->
% i* F ^2 y3 @/ E6 e; f2 ?
</script>
- P' f% S5 D7 c! D+ a
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
0 @1 p+ i7 X& s2 f! f6 p
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
$ k% G }0 O' O3 @4 `4 v
<%
5 X( `1 M" C* F8 w+ e- {# I% `- H
cdatasource ds=new cdatasource(); //数据联结bean实例
' ~% s" @; {4 F) E! j% T" K
java.sql.connection conn=ds.getconnection();
! o4 I+ ?0 N& M6 ]" F( S
java.sql.statement stmt=null;
. |* j% p; w1 h! ?6 J: N- {3 `
java.sql.resultset rs=null;
. }8 p# |. |- g+ t7 x+ G
cdatacheck dc=new cdatacheck();
2 X3 Z2 v" Q& L2 u. x/ D; n# ]9 _
%>
* p* b( _' _3 N; j D8 H8 F) v
<%
g" W, q, W! Z" ~9 I/ J
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";
# x2 C; Y) j5 I
stmt=conn.createstatement();
- k" t; D% [6 R5 C
rs=stmt.executequery(sqlu);
/ \4 R& x9 y' }$ \: O0 q* d3 _! [
%>
' d- i2 i' M# R. O- q5 |3 A# R
<script language='javascript'>
8 v7 `/ g3 P+ E9 ^
arr = new array();
. o, \8 e1 Y# m* o* r' x9 [8 r
<% int temp=0;
9 M1 J Q) s# E* \& X: o
while(rs.next())
' J3 E# g* X6 E9 `: z
{
; n. c* ?3 L9 s- m- s0 l c
%>
8 i! h! x* g) d7 c. g6 C5 ]
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
$ K( [0 J \( e, B" P0 Q
<%
e: b; [0 C' s# H: l0 }
temp = temp + 1;
0 ^# Y; j# m! _- a& i8 E
}
' b) i& _: p3 d3 f; U
%>
% f; A# W I1 d& B- ]; s
temp=<%=temp%>;
8 f$ Q' a z5 S
function changelocation(id){
( ]3 l* r# ~1 K
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
' p) b2 C( h4 J- O
var i = 0;
7 s5 ^4 Q* j/ v( F! D
document.combo_box.city.options[0]=new option('-------','');
7 z8 h P' W. f+ Z- K; k
for(i=0;i<temp;i++){
, G$ `+ L. L2 N' T; o- z
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
$ W' [% L! l! `2 K
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
. g/ Z, i+ e9 J9 g
}
( f- V4 j1 S1 n6 }) f( ]3 Y4 l/ l* V* |
}
7 M! n6 [& e' M0 {) S
}
2 [; F2 m4 D1 v. e/ o1 x. Q: g
</script>
4 ]# o- \% Q8 N
4 J7 C% z% w1 w: Q" g
<form name="combo_box">
9 p+ F) E, D9 A- v' H ]
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
5 ^: y# h1 e' t: }1 [( t
<tr height="24">
' A2 Z$ u& x6 M2 S
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
" N, L7 z! C6 r- N e% u
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
0 S& z+ z9 ~: v% t' q z' g7 f, h
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
0 w8 Q: d, \9 o4 g
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
9 P$ B5 \( J; c! [5 F
</tr>
; {+ y8 K2 Y0 ~3 p5 T/ r
<tr>
! j$ n# T2 ?, H& [- q9 `
<td>
7 M) W+ f& W! p
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
, v) f7 ^4 Z6 l" r7 @( f2 s
<option value="0">请选择部门 ---></option>
* x5 {. I$ |* E8 W$ `
<%
8 L: n2 R/ {* l' _/ j% ]. Y c
string sqld="select * from tdept";
& K+ F9 E9 W. x1 k: x$ w
stmt=conn.createstatement();
( [+ ?0 ~5 S5 x! r# G
rs=stmt.executequery(sqld);
1 l; X+ s, [' ?
while(rs.next())
: s6 A( Y8 a! q( n! Z- c% s# o
{
* {% \3 Z* H9 g0 |) l1 V! V
%>
% g/ B- _5 [" L& L0 X! N
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
- m! a; X# d& O( o
<%
& u, N) z% B1 n; `+ @1 t @
}
- e- x5 Q9 m6 g. R' g
%>
: H: Q' v& P- o! g: _3 Z
</select>
8 ^6 ~" f8 ] \: |
</td>
( p$ X3 T8 L& w! u8 j y+ F6 u% g. R9 I
<td>
* p0 `! Y# i" `; ~; }
<select multiple id=city style="width:150;height:200" class="bgc">
/ J4 ~1 T1 v: Q5 x
</select>
# n0 M/ o. s e& @$ d4 @
</td>
% f* p! K& t! ~0 Z. c: B
<td nowrap align="center" class="bgc">
3 U: x; _- m3 q9 N5 m9 O% f. Q
<input type="button" value="<<" class="buttons">
9 w2 ^/ d6 q( D" ?$ h$ t% q5 F
<input type="button" value=">>" class="buttons">
3 L# u; Z5 H5 ?4 F* M% q
</td>
( U% S& ]: r4 U) \ G
<td>
/ y9 H" }! {/ i0 j, o
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
8 `$ R- x7 { k* `, H, c
</select>
: g; w3 [: S T" E
</td>
* V9 `& \* [6 `' s# p3 x
</tr>
, ^ w/ r/ D% O. M" j! g
<tr class="bgc">
; L" T8 p# F& X* J# `. y
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
3 A, U. J6 O1 {* U5 k
</tr>
8 I& A% V2 M; t
</table>
* Q( T) r9 e2 ?9 a; m5 A! G# |% @
</form>
3 E4 e7 p" }$ Q" w9 f1 i
<script language="javascript">
; H% l6 x* i; j
//人名移动
' R- I! a/ ~ H8 X* b% R( w
function move(fbox, tbox) {
. v8 a9 C" k; V) y3 g; d; o
var arrfbox = new array();
/ m. [3 F+ p& f1 J) h. o
var arrtbox = new array();
7 U1 x' g7 \" d' ]& K1 P
var arrlookup = new array();
' q: Z1 {+ y; i! u' j
var i;
! \: _; ]/ e+ B1 a- d9 v% s4 s
for (i = 0; i < tbox.options.length; i++) {
8 c1 \% m. b3 a1 H( l3 S, x
arrlookup[tbox.options
.text] = tbox.options
.value;
* n5 q! k" j* D$ k
arrtbox
= tbox.options
.text;
0 [8 E/ d. u* @: ]/ @+ D
}
- Y9 E1 e( i! j. |; ~% j
var flength = 0;
+ U$ a) a. J+ [7 R
var tlength = arrtbox.length;
, N$ S/ ~( b+ i2 r
for(i = 0; i < fbox.options.length; i++) {
_* R# {$ f5 P( u. H+ b
arrlookup[fbox.options
.text] = fbox.options
.value;
7 h: y3 V% A+ C4 E2 [1 T
if (fbox.options
.selected && fbox.options
.value != "") {
+ |& ~7 ]" l' {
arrtbox[tlength] = fbox.options
.text;
# \" J& W; k, C3 | d5 x$ G3 d
tlength++;
: D8 V5 C! d0 }- ~( a0 U
}
# _# _) r, l7 Z# T& X6 w
else {
9 C& j1 ^( _* D+ R* e, ^' c9 S+ F' O
arrfbox[flength] = fbox.options
.text;
4 L9 u* t B2 v& @+ M0 ]+ ]
flength++;
) _( h1 b7 o/ v, e0 { U
}
; P1 g0 x% u/ h: C8 u& c
}
3 M, C; ]! L3 }% X; r: o
arrfbox.sort();
8 b5 x0 O( D) @% p* X X: r
arrtbox.sort();
" [% `. p; }9 t6 p1 ]
; B* B' Z+ ` C' T2 P9 u8 J. \& ]6 A1 A
fbox.length = 0;
9 I1 }: m6 A r. B4 r7 `# r
tbox.length = 0;
: r' y/ U5 p" q& r9 |$ F) C1 ]2 I
var c;
: I% x5 L9 N4 F8 ?6 `
for(c = 0; c < arrfbox.length; c++) {
|, X7 q% V4 s- w2 n
var no = new option();
4 Q' n/ J2 H' ^9 w3 `+ q
no.value = arrlookup[arrfbox[c]];
5 ~1 c0 h- H. p$ q
no.text = arrfbox[c];
/ E) s' n. T o+ N
fbox[c] = no;
6 Z2 P6 t8 |6 f* h
}
0 l+ l% u5 N8 n* c
for(c = 0; c < arrtbox.length; c++) {
- F! E6 V& I7 b1 [# h2 S- U
var no = new option();
0 a4 \1 S; ^- \$ m
no.value = arrlookup[arrtbox[c]];
1 c$ T2 G+ g- u& X) b3 Z
no.text = arrtbox[c];
6 T0 {* l2 g2 G! U6 v4 f H# x
tbox[c] = no;
, N( C- Q5 [! b7 v& v& w7 L6 M. o; e" @7 w
}
& k, F; v: M5 \) {* j# L
}
: P2 M9 i2 @ @8 ]8 j4 u1 d7 |
</script>
4 p' t4 S6 }5 q8 J5 \, s+ f/ N" s
</body>
2 A- P8 t& k( W6 p' a$ w1 M
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
