标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
5 S3 m: }) K' |, Y$ F: Q! K) a
c pageencoding="gb2312"
7 C) i: c1 y$ ]- [8 ^' q
%>
0 l, d4 @+ {0 ]
<style>
& {$ {" I7 M& K4 Q7 Q+ t% Q( D8 c
.f9{ font-size:9pt; }
7 o# e3 e- ?* K3 Y9 M9 V2 H1 ?
.bgc{ background-color:#aecaf9; color: #0033ff }
% }& Q9 j6 }( Y) u/ J* L
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
/ r" D5 O, c" A
border-bottom: solid 1px #4e7dc1;
% C% }! ?, e" Z' ^
border-left: solid 1px #aecaf9;
: L% {- q+ _0 i% ^
border-right: solid 1px #5679bd;
3 I5 A& {$ e+ S/ v
padding:1px;
5 B% A) j9 Z8 T+ C
margin:0px;}
! n) `: d6 [( t; _
</style>
6 j. a9 n4 m4 }' ?1 S
<script language="javascript">
# y: p" z( G/ M: H7 R1 Q2 d/ C* A5 P
<!--
6 ]2 Q/ E" V* |
function rv()
7 O( \) C5 w) T* o6 j0 {, @. n
{
0 p) B" N1 D' N6 f& J' R
var val="";
4 L! L- O2 O- |8 f5 [7 `
for(i=0;i<combo_box.list2.length;i++){
. w+ c; F0 z$ \* A1 K+ ]) r3 d
val+=","+combo_box.list2
.value;
7 K V/ A8 j( g) `
}
& I( D V% G0 q$ c$ I
if(val.charat(0)==","){
' h7 N2 h' E9 l: U4 J( N3 B" n
val=val.substr(1,val.length);
! |1 ?; x" i5 B0 X1 }
}
) E* A4 Q! P3 j- Y O7 G& W7 V
opener.form1.frecname.value=val;
5 V4 i- w2 k1 E3 s. y# h
self.close();
2 y# G. F3 q0 S$ J# r$ @" a
}
" t5 Q4 m# Q7 T$ w$ k
//-->
3 a* u5 K4 |# g2 u1 S$ B$ J
</script>
' i* u0 T! H8 c( C: T5 L2 F* R
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
' J( u% q7 h7 r/ O3 X
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
8 q2 r0 w$ g3 P- R5 {- c+ j$ ]% j
<%
( q: p$ j6 W% r. v# j
cdatasource ds=new cdatasource(); //数据联结bean实例
5 N( J" Q1 `8 m5 u: j' @/ q
java.sql.connection conn=ds.getconnection();
* ]% x2 |: Q# Y Z
java.sql.statement stmt=null;
1 Z8 \: r) w0 @7 e" G6 \
java.sql.resultset rs=null;
+ v2 ?1 \/ c0 H2 B3 f+ A
cdatacheck dc=new cdatacheck();
: X) G2 a8 W6 U
%>
( Y$ R8 }& c) X. S/ Q6 Q
<%
. G- z5 O$ {, R* ^9 x3 ~
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";
8 H# }/ m7 @4 z0 T
stmt=conn.createstatement();
8 D! `( i% w4 ^! i+ p [1 k
rs=stmt.executequery(sqlu);
- B( ^; s; ?6 h) s, x
%>
. \6 ]; v. f* R1 k! }/ [
<script language='javascript'>
6 |! q" F3 A. @/ [7 {, w
arr = new array();
1 N p! p: J# V( y9 a7 {4 [
<% int temp=0;
* v% u" Z8 @$ h' F; M
while(rs.next())
4 _- X- r1 l0 f! n- N+ h6 V
{
8 D$ z+ |0 R- a8 X1 a
%>
* y2 ~" P8 P7 W2 @: N
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
, k3 |+ g+ g/ S6 h3 w" U/ Z
<%
$ _1 K, l3 i: X! `2 C' X
temp = temp + 1;
% `% p" l9 |6 ^$ F9 V, J D) F; D
}
% g' ]6 \9 d8 [8 q* z' ]; [
%>
; D' O3 v4 a4 k e
temp=<%=temp%>;
% I# ~2 H- G, R1 M. R2 G
function changelocation(id){
* E& Q, d" e8 q& a+ T
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
0 V- @1 B' ~8 U3 `
var i = 0;
+ Q8 r5 B2 K/ Z+ s- z
document.combo_box.city.options[0]=new option('-------','');
# w- A1 F6 l8 x/ m/ M( Z/ c" L* ?; C1 F3 ?
for(i=0;i<temp;i++){
' ?& Q6 a& \( x/ A% F% E( D
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
, F+ t* k8 j& X/ B6 ?2 j0 @
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
4 Y6 W6 R" ~6 ~+ V- b* e
}
q2 y1 I9 ?# Q3 S' L0 e
}
0 M$ s9 Z9 X5 [/ [
}
7 Z) j0 F2 p( M0 w- v
</script>
: _0 Z y. r! l
% n+ y. o; H; o$ ~
<form name="combo_box">
- A: L/ A2 k( O) `1 I+ G
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
* C9 u( h. u1 O! \( k) }* x
<tr height="24">
; s* }7 h- h1 d$ A; ]5 F- [
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
1 i: i; E0 u; _, m- @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ J; Q. S& Z+ i! ]5 h5 k
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
& C \% e3 a9 _" x* O* b3 ?) x
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
: _ ~9 v3 R% z! s$ _. U/ a8 F
</tr>
6 ~, Y( [7 [# I/ Y* N: i6 s
<tr>
; G* \, t% z- X0 |7 Z
<td>
* v ^+ X$ V0 i% C, c0 a
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
& d/ t7 V2 Q# i* |& G( r. R
<option value="0">请选择部门 ---></option>
$ |: ~, ^, X) O2 |
<%
/ {! u4 G! {6 d) L2 K" c
string sqld="select * from tdept";
: r# d& Z! Z5 y2 m
stmt=conn.createstatement();
: e$ p# j- o) d! |
rs=stmt.executequery(sqld);
2 ^5 S4 ^ g% j2 x' _. q: ~
while(rs.next())
8 _1 ^: Q& v, u8 ^
{
# t4 @+ f1 l" k. R5 a" p& M# S
%>
7 a) [9 L* E, }& p1 Z' s
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
: z, A6 G. N$ e# `1 a( R3 }
<%
2 K; m8 @4 S. c y% |
}
9 Y3 c& \8 }; ]9 W" i, J) W
%>
& X- g* M( _4 t; J+ N( k. O, a; C
</select>
3 k. l% s- p8 X& `( _
</td>
g9 k" r. @6 p, n
<td>
- [" @" p, F, S2 k8 Y
<select multiple id=city style="width:150;height:200" class="bgc">
+ b& P3 `1 c1 t% O
</select>
% Q$ _: U1 `! i$ T" w7 e# ^- N
</td>
5 M6 e: j& [/ T; K( ^
<td nowrap align="center" class="bgc">
* t" L9 l7 S! q5 \3 u
<input type="button" value="<<" class="buttons">
# E/ u0 a% E& w
<input type="button" value=">>" class="buttons">
1 y9 o; `5 w# R1 p4 B
</td>
`7 g* i. o( ^* }
<td>
* n$ b4 B' o1 z) Z, l0 X
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
$ {! x8 t) q; ` I. C$ ^5 N3 I
</select>
0 a" r# n2 [( R/ `4 ~& r
</td>
" s5 I5 y: v/ @/ F: a& j
</tr>
; d$ F- A) o% n6 \- v: }# d: M9 [; N
<tr class="bgc">
. @0 n6 k# b; `8 { }
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
6 S, R! n1 |0 s% d2 Y7 [
</tr>
2 p! E) ]( a/ f+ a
</table>
+ x; u. N2 l# F. n8 o. S, S
</form>
: t/ h! C+ \7 g3 n; ~! f8 U
<script language="javascript">
/ q* y. l* T* C+ ~
//人名移动
0 V% p9 b2 b# y) M. o
function move(fbox, tbox) {
) \/ r+ i" B6 p' }1 _( N- \% [
var arrfbox = new array();
% z# D8 ^- b x% [( U- X
var arrtbox = new array();
: F: a! Y! S+ Q
var arrlookup = new array();
2 }4 Y5 h6 d% R; i( y3 F
var i;
( Y, _9 [1 W/ @
for (i = 0; i < tbox.options.length; i++) {
( ~$ N1 @( f d8 m& S. {
arrlookup[tbox.options
.text] = tbox.options
.value;
% I* y4 q& h$ U6 g( K- }4 \7 N
arrtbox
= tbox.options
.text;
% Y; m$ i" j0 s
}
% x8 M/ p$ @! T7 q
var flength = 0;
1 U8 @. C7 @3 a# V
var tlength = arrtbox.length;
* e0 R9 i' {) x- f8 ^2 K7 L
for(i = 0; i < fbox.options.length; i++) {
3 v5 x6 Q( P$ Y$ i0 T6 p
arrlookup[fbox.options
.text] = fbox.options
.value;
! ^' G5 ? J8 y C& h( a
if (fbox.options
.selected && fbox.options
.value != "") {
4 r/ U1 J6 e& f! S3 H
arrtbox[tlength] = fbox.options
.text;
5 } S: O% a9 f
tlength++;
2 U/ f% o* j" c4 Q# C2 K) M: [ J
}
! ]7 d6 N) j9 J! M; ?
else {
1 w0 s+ A8 c3 h# G6 J# N" \8 Y4 w
arrfbox[flength] = fbox.options
.text;
: R: d5 Q7 \7 M$ G* A* x* Y
flength++;
( s. H0 h. v V2 H* h
}
8 H% J) c+ h7 \ G: _4 _
}
! r5 q6 P- J& T% a, I7 |$ L5 G
arrfbox.sort();
" m1 B0 v6 M" G. J
arrtbox.sort();
; `& Q% z+ l6 V1 l' b- c0 b% A
2 l1 }6 H9 H3 e5 C/ A3 N
fbox.length = 0;
( |+ x) I6 e1 I6 n3 k* R! d
tbox.length = 0;
3 z# A" p: D2 Q( U& E! {6 t+ M, I
var c;
3 ?' b( {# e; S% Z% M$ R. Z7 T
for(c = 0; c < arrfbox.length; c++) {
2 v: e( e& r, ~3 l0 D) \9 |* @
var no = new option();
0 v$ a, P& m8 w: k
no.value = arrlookup[arrfbox[c]];
8 _. ^9 x; S% N' h& H
no.text = arrfbox[c];
% F2 s; n6 z" l& N* L6 `
fbox[c] = no;
9 r% ?% [, U | D
}
, t9 W- k2 W# p+ I3 W8 {
for(c = 0; c < arrtbox.length; c++) {
# Y& r1 R" W" Q4 x
var no = new option();
3 m) r8 h$ o/ h9 N9 G3 _7 ?! \
no.value = arrlookup[arrtbox[c]];
9 \; s3 y5 {3 d- I
no.text = arrtbox[c];
% B1 ]' m$ _7 m6 U2 r3 w
tbox[c] = no;
- ^% _. U4 S3 ^: C! O* N8 J
}
2 G4 |% V( [0 [
}
' x- ^* h; t- J. [8 D( |# j6 k3 y
</script>
* h9 f& l% {4 l2 c' k# h
</body>
# |8 Y7 {7 {3 G) f5 m1 r1 H8 D* F
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
