标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
4 A% E5 T, X3 x( |& o2 }
c pageencoding="gb2312"
5 \) n. u3 v# U& c/ x0 L0 F
%>
B+ X8 M* K% b: b! w- j, a3 U
<style>
4 T% y: f8 }3 }6 ]! h
.f9{ font-size:9pt; }
& v' n$ [! c2 X; g$ z: G
.bgc{ background-color:#aecaf9; color: #0033ff }
( x7 `/ I) H. ]% p
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
2 k/ V/ c! B" U/ o4 ] J
border-bottom: solid 1px #4e7dc1;
7 x2 f2 U# |9 t
border-left: solid 1px #aecaf9;
0 V% ]- ~- ?; |8 L2 }3 M
border-right: solid 1px #5679bd;
7 W5 q& i( r% B6 T, M, J
padding:1px;
4 O" S; Q o5 e h; P8 q9 i
margin:0px;}
* A: z4 o8 ^1 B) Q9 e' J3 Q
</style>
. r {) }( P3 i/ S' _# }- [* [
<script language="javascript">
/ Z, S" ]# D6 O" M k- W; {0 t
<!--
/ X# {3 m& p" m" u8 Y0 j
function rv()
$ G; z7 R% G% a. j" W& b l0 H* z4 L
{
/ g) b8 j; I; K+ A5 u: ]9 G8 a& y
var val="";
) l6 o n" n) a0 d) V
for(i=0;i<combo_box.list2.length;i++){
# G! g0 j% U0 E0 O f& U
val+=","+combo_box.list2
.value;
' Y9 z6 f, o- s V. j' J/ E6 T/ C
}
6 O2 y- L* ^4 {' W9 w+ [. I
if(val.charat(0)==","){
7 Z7 t" k. d) r! |( G, m
val=val.substr(1,val.length);
# ?& {9 G( T! y( U8 ?
}
( d4 H- m- E+ t U; g9 t0 `* S) a4 r w
opener.form1.frecname.value=val;
* Q; F4 C# K! T- I, I/ v
self.close();
7 U+ |: n' U/ ~( d/ E" @- @
}
1 b- u: A$ i9 b, @
//-->
1 L, z/ y' e2 y
</script>
; J1 `) o( [' i( U) i
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
1 q- h. Q2 ~& a, H n8 z# j* x: h
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
3 Z ^+ s ?5 x
<%
5 _* k% {1 [1 b
cdatasource ds=new cdatasource(); //数据联结bean实例
4 E. t+ f! [0 ?
java.sql.connection conn=ds.getconnection();
/ e5 ^" n6 r- a; C8 Q. k, Y1 Z
java.sql.statement stmt=null;
# i0 Z4 q& R' ^6 X
java.sql.resultset rs=null;
+ U& j* l& [. y; o2 p. \( N, t3 i
cdatacheck dc=new cdatacheck();
: M1 g( w9 X% M8 Q" {, M$ r- {; r
%>
8 Z: Y9 I: Q9 k% A$ k }
<%
9 C2 ^! Y4 Z8 H8 J3 {
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";
: Z9 U" \+ @3 F1 m$ v
stmt=conn.createstatement();
7 y, g* s5 {, Z$ P: L
rs=stmt.executequery(sqlu);
% q7 x& N& ^( g' K6 F& w
%>
: S9 ]+ Q+ Y v* I' l
<script language='javascript'>
- D: P% p9 r1 V. H2 m
arr = new array();
& J. y# ?4 `8 \+ a# j* @
<% int temp=0;
9 H, G" D% f+ Q& g% b* A
while(rs.next())
t* H+ x) |! _ n$ t/ g
{
1 _4 l6 I/ r* x% I% T
%>
; w! `; k0 o! o# q6 F
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
" j1 A6 f/ U* c+ k) u8 q
<%
4 E e [2 S! A' T& V+ v' g
temp = temp + 1;
. i* O5 c, p1 t. z
}
! _, I1 B/ n3 Q& F" x! u
%>
" K U5 Y0 j+ i1 T; n7 W0 k. ?
temp=<%=temp%>;
) e! P6 J: E6 L
function changelocation(id){
) t5 Y7 `$ R8 K) z! e, F
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
% \' A1 q+ E4 }, x Z, l- ^) M
var i = 0;
) k7 L( W- s: A3 }) n% S
document.combo_box.city.options[0]=new option('-------','');
3 t/ L% s5 L* ^$ d$ X; @5 j
for(i=0;i<temp;i++){
6 j, p* k6 L4 f2 X9 ^% h/ Q! K
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
& _: z# y8 q0 P! T% a" T6 M. ?/ D
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
! S8 F0 Q7 r. f3 v1 a2 N! c
}
# Q; H, W% w; J3 ?4 a) n
}
* Y0 _2 w0 A7 V$ u7 {0 U4 Z
}
/ G' P, n. G+ u* D- r1 c
</script>
& S5 V) I9 _, e9 n) ?$ ]# T
5 L4 k, A% c8 }( [3 ~! v- f3 v3 j
<form name="combo_box">
! ^ R% W0 W" p( |
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
$ U! z' `) S6 f, n
<tr height="24">
7 W, O' ^) W' R9 o0 \
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
6 `+ p: V) ?, _# V) \
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
$ @$ A* w) A8 Z8 ^; W
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
& [2 P- X% ]& Z0 S% Q$ X
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
1 X" G" N( ]+ K' z; t& Y4 s- j. E
</tr>
6 G/ P. P+ e( C* I( D* M
<tr>
0 \* D6 b- A0 i2 F3 w* a
<td>
. Z r! o! T% G! B
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
2 S- H; m, W) y8 }: b% H
<option value="0">请选择部门 ---></option>
7 Q4 w6 G4 T7 I' f6 c9 z
<%
( H1 A9 A# E* R d
string sqld="select * from tdept";
0 I, B5 _- Z2 w- z9 [$ }& i5 k
stmt=conn.createstatement();
L! _! S& \$ G+ x* G; Q! f+ g" F, r
rs=stmt.executequery(sqld);
" e& V/ o; p' J4 v
while(rs.next())
( d: R$ d- }% g' l" X; g( g- ^& H+ l
{
& d7 E4 c% U7 c, i/ D
%>
1 k4 O* n' [$ A2 _, P+ Q: ?
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
& F9 T" Q/ T3 G Y) `& b% g
<%
! K" p( ], V7 ?
}
$ X. E# a5 `2 W! D/ {
%>
8 J3 o7 Q o8 p! C" q9 B$ J
</select>
" |: I6 J+ o, M) h5 o v
</td>
( {( X' M9 E) C6 m+ F
<td>
/ X( g) o, T; K, `# y `- Q
<select multiple id=city style="width:150;height:200" class="bgc">
; ^0 i+ \& ^* B- b, H+ B% T7 o1 o
</select>
( j* \% w) f6 x4 D9 b
</td>
$ F& c0 ?2 R1 G' o
<td nowrap align="center" class="bgc">
: G, p' z2 }% z1 Y/ U( z2 i
<input type="button" value="<<" class="buttons">
/ P4 W) k. s' w8 l1 G
<input type="button" value=">>" class="buttons">
Y+ q4 G J# [) z
</td>
$ g( G6 {. C: ]* Q2 H
<td>
" d4 n& Q2 ]6 o1 t1 q3 c% t
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
/ C) ]; N; y( h
</select>
2 A) C+ G$ g) r! x3 g. H2 n
</td>
$ e. I! C ]- j, p, f+ ]- K
</tr>
: F2 `( N. H/ t. Y
<tr class="bgc">
: U+ ]4 w) ^$ D0 _
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
4 B4 w2 `# Z9 F, I `
</tr>
( a9 @9 S% k3 H) t
</table>
& ~# Z. _% X$ H# Z* a
</form>
, g3 v% M C. e9 M- @
<script language="javascript">
! L! B6 ]7 ?! `3 a- Y- T
//人名移动
) L" l) Z; m0 k; v
function move(fbox, tbox) {
1 ]% ?: v" s5 g2 Y
var arrfbox = new array();
' f# i1 }6 [& y2 s r% Y+ ?
var arrtbox = new array();
7 @2 ^0 [7 u, Z
var arrlookup = new array();
/ G9 H- O$ `; |# r6 z- d# T
var i;
( `1 \ h% U5 a7 V; S" f
for (i = 0; i < tbox.options.length; i++) {
* b8 P: I1 U; X( n" ?4 ~
arrlookup[tbox.options
.text] = tbox.options
.value;
/ n# b) c9 F) L: {0 V3 {( P: x8 F
arrtbox
= tbox.options
.text;
, F: M: @; w+ Q# M0 q. y
}
6 v! q& B, r2 _4 m: `! I" B
var flength = 0;
3 g- o4 }" o5 f' f; \
var tlength = arrtbox.length;
& t9 h# U, p2 o! Q7 q
for(i = 0; i < fbox.options.length; i++) {
% ~$ Z/ ?. k2 X" U6 Q
arrlookup[fbox.options
.text] = fbox.options
.value;
6 ~+ W) L& y' R2 R- G/ ~4 o6 r
if (fbox.options
.selected && fbox.options
.value != "") {
+ p2 E" F9 ]* l6 D
arrtbox[tlength] = fbox.options
.text;
% }% T& k( ?* K* z8 {; n
tlength++;
2 T9 f j, e3 H
}
/ r! A2 r0 O( }- M/ v* o9 J
else {
3 c: F* K2 Z4 k/ M
arrfbox[flength] = fbox.options
.text;
' R$ P5 ~: A* J6 P& J
flength++;
4 v# _3 G5 O7 t; _) ]/ U
}
& C! f/ l" Q% _/ u" [' D* X& y
}
- n. C# d$ V- v
arrfbox.sort();
8 |1 j" W6 G- j5 a7 `# @ W, e
arrtbox.sort();
: C, p* V* @3 q
+ c( o- W# t% d0 j
fbox.length = 0;
! \2 q2 y- i' v& D2 b6 e
tbox.length = 0;
4 d( H6 ~) i) b: e5 q9 a
var c;
: z J5 Y% v. r. `* i/ Z4 s4 z
for(c = 0; c < arrfbox.length; c++) {
- i/ m+ i }! |9 z4 A$ \3 y
var no = new option();
- X+ o% ^0 N) g$ m3 b
no.value = arrlookup[arrfbox[c]];
2 L# f l5 E/ b
no.text = arrfbox[c];
1 X! Z- u' H* G$ @9 { H1 ?4 X8 F
fbox[c] = no;
$ R9 C3 N6 L2 D- o, K# i
}
% y* H+ w' ]5 j3 |" I
for(c = 0; c < arrtbox.length; c++) {
" ^% m8 C: k& v q; b
var no = new option();
+ [6 z* x* R+ n' R+ R* J8 l
no.value = arrlookup[arrtbox[c]];
& u+ y* H! Q+ {0 E O- k% m
no.text = arrtbox[c];
, j6 N7 @ c% d2 W- s: Q
tbox[c] = no;
3 k7 J# M) V9 K% g: U
}
1 m8 U$ H! Y- M
}
0 Y- H, R |, v& ?& a3 D2 l4 S
</script>
2 ]) U; I; R( M e
</body>
4 ~$ \8 }' J+ u2 r% I& }8 E/ _
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
