标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
8 O \/ G% }, m: b4 S! m1 }7 L ?
c pageencoding="gb2312"
* a) E; C! h' x+ h; C3 {2 X. \
%>
+ r0 A- K$ d7 p# v5 E- c* ~
<style>
& Z5 x( F) f/ H J% s
.f9{ font-size:9pt; }
) m% ~9 c. {2 S# e& L
.bgc{ background-color:#aecaf9; color: #0033ff }
) j1 s5 s J: w
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
/ J9 } |4 @- N( G: M: L, u. |1 ^
border-bottom: solid 1px #4e7dc1;
7 S. h( b; G4 _) [! s9 j' Z" ^
border-left: solid 1px #aecaf9;
6 [8 J8 B5 d2 K: N% {6 K
border-right: solid 1px #5679bd;
2 y( E4 ~ m0 l( o( d1 |' E
padding:1px;
! D! x) R) D: N }/ y
margin:0px;}
& @1 x- X5 n7 s/ `: ~( k9 o; d
</style>
' w2 S+ u8 |& ?/ v; s5 `$ y
<script language="javascript">
$ {7 Z2 k+ _- `
<!--
; F7 _* a6 ^ l
function rv()
/ M y/ Q4 ~; K9 M
{
' _; Z7 ^: R3 d+ `: I4 B; ^- z" V. d# N
var val="";
m* e8 M& f, O
for(i=0;i<combo_box.list2.length;i++){
4 N' P% G0 Y) X7 Q0 ~9 L: Z
val+=","+combo_box.list2
.value;
+ I) R6 E2 F+ |/ {6 ?$ E% v/ U; |
}
% Q0 G- M# x- M" s' f4 }: g- H
if(val.charat(0)==","){
0 W' j, I6 I% M$ `& o6 ]/ ]" B1 T
val=val.substr(1,val.length);
1 [; @: x5 S% E1 K
}
" y8 w0 F3 E9 B2 L0 A: q
opener.form1.frecname.value=val;
: l9 O( x- b0 k: a& s1 O
self.close();
S* v- O2 v# U* L6 D
}
0 G, G3 M/ n- O" m5 S( K
//-->
# e/ |2 X, g+ W9 v {, s! A1 a n
</script>
/ d7 y; Z6 b5 R c
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
( F, _; z# p! b$ ~* T
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
8 K0 Y2 k7 k2 t5 W' k5 l
<%
6 [4 _7 Z# n% Q3 W+ Y9 ?
cdatasource ds=new cdatasource(); //数据联结bean实例
# @( H8 ]$ E5 |- f4 h% T" W, @' \
java.sql.connection conn=ds.getconnection();
% Z6 u) v& q8 S8 c" c4 x d
java.sql.statement stmt=null;
" q; F1 \2 P# [ s7 [
java.sql.resultset rs=null;
) d9 l$ a2 Y4 N
cdatacheck dc=new cdatacheck();
8 L+ `6 f7 v- i! A8 v0 N, y( q7 ?; y
%>
. X, b" @/ m- C: S' [, w0 {
<%
( O: B3 S1 {$ O: ^) n0 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";
: a' k- E+ U8 [6 f u9 g0 L* S
stmt=conn.createstatement();
# i# H, y" |$ [6 c- |) o+ C* s8 k" m V
rs=stmt.executequery(sqlu);
7 `: \% g7 z+ p$ M/ j
%>
2 T7 m$ f/ `8 R
<script language='javascript'>
# D8 a8 V0 r# S/ `; ?, T0 c
arr = new array();
3 X; z0 l+ J' v1 H1 u
<% int temp=0;
9 u' F% L0 X# b7 X7 J: L
while(rs.next())
8 w0 C6 v0 w" q2 A
{
2 D5 z1 E) G+ u3 V3 ?
%>
! z* l4 A& ^# N+ v
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
% z% k x: b: U: N6 g
<%
1 p4 E" r$ i' y
temp = temp + 1;
\7 G# k& ^2 f
}
* D9 m' ]4 v( a( d
%>
+ D' q5 t) v; J. i- k$ V0 e
temp=<%=temp%>;
* Q# ]0 N5 A7 Z: j
function changelocation(id){
! n; {4 ?) L! ]7 F8 E* p' t; v
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
* D+ M) @4 i# u: q! P) o7 }
var i = 0;
0 y7 p- g2 _! G% Q
document.combo_box.city.options[0]=new option('-------','');
( Q8 a# t5 }8 ~, O5 R$ h
for(i=0;i<temp;i++){
* o4 P" @$ g3 ]% ^! k
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
+ e+ s" g2 v2 T
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
& T W/ A- ]/ d' C3 ~0 N3 V
}
8 Z3 \, R- p& O* z5 g3 \$ \' f
}
9 r) Z- z* N" k! A. `$ l9 a
}
; w! h7 T% x* u
</script>
# E) K3 I; w. r7 T0 n! |
* l# I5 i7 |# n$ G; o; U
<form name="combo_box">
3 ]/ \2 L. ?1 f' R9 z: C! E
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
$ }! P- j/ \+ y8 x" s
<tr height="24">
& H s3 Z) z1 Y$ q! s
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
& U5 w9 [: C( d2 \$ c; u& F
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% G* m' v) J, H" d. C- |3 K
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
* t4 _7 I6 B8 O8 o
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
+ L/ g& v" y1 D' R/ O
</tr>
/ s3 }/ c% c) z
<tr>
+ c( J$ h8 V% k5 C% a! u" a
<td>
8 k# @' }# q1 A& W7 n8 t- H0 Z
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
( n3 j! ~$ \" ]) z4 ]
<option value="0">请选择部门 ---></option>
( r% p4 ?' t6 u# v t4 M5 ~
<%
! j- z: o5 t( v' ~1 l" D- V
string sqld="select * from tdept";
0 S. i& w" z/ A: J0 e% F' J
stmt=conn.createstatement();
; v& w# A9 Y$ K E8 z% l
rs=stmt.executequery(sqld);
6 x# Y4 e; ^% E) K& u
while(rs.next())
- Q+ t7 m& t. p, ?( j
{
* b- ~! f& b- v$ n2 b. M
%>
- Q2 m; M# a! P0 M! c& d
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
& n# G5 b. a! \1 b# w* ~
<%
, Q3 H H9 _! Q- Z/ N& s/ ^
}
@" d) V a7 n0 I% F: P% n% B
%>
4 k1 y' e8 V# G, M$ @
</select>
0 z0 \$ E# o/ y4 f% K* v- m! W( {6 z. R
</td>
4 A- w$ l* z2 }/ L8 J. q6 I5 a
<td>
" }" E/ x2 }9 ?9 O( r/ V: l
<select multiple id=city style="width:150;height:200" class="bgc">
! A, n' n8 o( u* l- r2 v$ T( S! E
</select>
4 k2 L n8 c8 \7 H; J5 \
</td>
7 l" D/ q6 d6 }! P, ^/ a" L! ]) `
<td nowrap align="center" class="bgc">
) v0 ]5 W4 [. Q
<input type="button" value="<<" class="buttons">
" \; R/ q# y. k
<input type="button" value=">>" class="buttons">
( M1 ^% x. ]1 [# i0 O- `
</td>
+ z* K; s* g4 Q* E M* l/ ]
<td>
* V8 H5 y7 \4 O% v& K/ D4 @
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
) @1 h; k. i* G' S2 a" ~
</select>
' a9 G; u. ~3 F) R2 Y
</td>
8 m) Y6 e8 p. y' V( t3 `& n
</tr>
! C; m. i Z! N! s- [
<tr class="bgc">
5 q$ X" u. F8 S+ p4 y `
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
2 R% i8 a% _: Z8 k( ~
</tr>
# e- | Y# s5 E- ]6 L7 Q8 F6 U
</table>
# q0 B, t1 f$ W4 j$ z9 _9 b$ G2 S. l
</form>
0 ?- L4 I$ A$ Q B! i3 u
<script language="javascript">
! V6 C+ T" ] M4 R
//人名移动
5 C9 M$ z0 v) K9 O* i5 P8 e
function move(fbox, tbox) {
& E" X! {5 D# C) t" R* F
var arrfbox = new array();
a; f$ a: @3 l' \; v6 ^2 P
var arrtbox = new array();
5 t8 o7 u( D5 ?8 w) I: _
var arrlookup = new array();
9 p. r- f5 E* m) m+ p3 m7 @
var i;
: B* Y* L9 |# b! T5 `
for (i = 0; i < tbox.options.length; i++) {
) k8 K/ s3 n! K5 Q7 D
arrlookup[tbox.options
.text] = tbox.options
.value;
# G9 T& K8 u' ~1 d
arrtbox
= tbox.options
.text;
) K9 z' O y) H3 e" ~/ J. S, ~
}
& O5 P- F1 R; } p
var flength = 0;
' J( T- m+ \! e( a d" Y; \1 L
var tlength = arrtbox.length;
( b5 d9 P# z' Q. t" j `
for(i = 0; i < fbox.options.length; i++) {
% X/ D! M% ]( n$ J
arrlookup[fbox.options
.text] = fbox.options
.value;
' P8 G9 S& N2 e" u9 Z/ S+ B
if (fbox.options
.selected && fbox.options
.value != "") {
5 v* k6 _$ T9 Y. l$ \3 r/ S
arrtbox[tlength] = fbox.options
.text;
" e; y% o, o7 p2 {/ Q, w
tlength++;
% I. q, Y% w# w8 H8 Z2 k+ A7 x
}
, @5 a& }' X) D( _; W7 y
else {
# x' S' {+ P2 m# w% D2 w
arrfbox[flength] = fbox.options
.text;
4 {9 A) J, M5 O, H
flength++;
. ]* y, |/ g, o9 k. C0 Y
}
- v! `# K2 K7 X0 ?7 c
}
) e) E% n* G, Y: h& `
arrfbox.sort();
5 k1 E/ _) U9 P% i
arrtbox.sort();
; [- f% r+ p5 W% |
. z! t+ \- q8 P; H
fbox.length = 0;
: q5 x2 H: k" z! f3 Z( G
tbox.length = 0;
2 G5 b. \: W* I ?( m7 w
var c;
y7 ~! f/ C( P% r5 s# X/ ?3 W
for(c = 0; c < arrfbox.length; c++) {
' q8 ^! w8 k, l& T
var no = new option();
/ J0 J- M& j, @; P
no.value = arrlookup[arrfbox[c]];
6 J0 T! W/ t* E; a( r' r" M
no.text = arrfbox[c];
7 j) ^3 r; y- e$ h3 g- N
fbox[c] = no;
0 U' b i5 d' P4 l" N
}
0 P* s& F3 a, ]- r, ~
for(c = 0; c < arrtbox.length; c++) {
! c# x7 o# w1 ~3 x
var no = new option();
% @6 ]4 O+ }- a5 G. p" ?% h
no.value = arrlookup[arrtbox[c]];
6 I' u7 W2 S3 ]" M2 \
no.text = arrtbox[c];
# ?0 @6 e2 c; ?4 S: a" u( ~
tbox[c] = no;
+ ~6 l0 @6 K2 ?; f" l+ s% Y; o9 j& D
}
% h2 l! Y" b6 y) H/ j
}
8 y$ K4 b; E2 I7 v
</script>
7 `0 E$ b* [2 ^! T
</body>
0 j, m) q. _; k; o2 I5 i
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
