标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
+ c( z4 R6 T% K( c& W$ O
c pageencoding="gb2312"
$ D ?& Q2 R( J, a$ h# @. X1 M
%>
* S: W" p' A7 I& v4 t
<style>
2 v8 t$ y, |* Q% r4 q& ~
.f9{ font-size:9pt; }
$ m G' b6 F/ ^& }2 ?9 M
.bgc{ background-color:#aecaf9; color: #0033ff }
5 R8 j f3 Y2 Y/ H m; K
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
8 z3 o H- _7 `- i+ ~$ x$ j) t
border-bottom: solid 1px #4e7dc1;
9 J; g1 a3 w& g/ B i
border-left: solid 1px #aecaf9;
1 H: O% L: \) q
border-right: solid 1px #5679bd;
- M5 h# w' t! m( B% u
padding:1px;
! P8 l6 N) l8 v/ x" V& j
margin:0px;}
' L, g# W. N4 A" F" y$ f
</style>
+ y) m6 P& z; G1 ]/ Y
<script language="javascript">
p) r" _2 f: ?6 Y: ?, ]# _
<!--
9 F5 b. B' `+ k% ?, c9 w
function rv()
' d% \/ ~8 n$ s1 ]1 I" e7 T3 g
{
& j( g0 t+ k: P+ c- w% Q& F0 Q
var val="";
0 f; S1 d* m b
for(i=0;i<combo_box.list2.length;i++){
/ @% s2 A- P5 d* c9 m
val+=","+combo_box.list2
.value;
1 b% l* P' o* x- I# ^0 P
}
+ U# u n$ o! r8 ^6 x, g+ i
if(val.charat(0)==","){
, r2 {$ s8 {$ [: v" o% [2 f
val=val.substr(1,val.length);
3 x$ S4 r# p# l. c+ G; q
}
/ q$ Y% H3 C4 g1 I3 f2 C4 L
opener.form1.frecname.value=val;
5 B4 O9 y4 F$ h2 d1 p
self.close();
' H% h n* o. M6 n# A3 H
}
) P* [2 ^9 @ d1 u* F, }
//-->
w4 j6 h, V `$ P" T K
</script>
& L4 D& S, T1 A; `. A& N
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
% a, R$ p' P6 }
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
. U) |& h3 X* Y9 b8 F$ d
<%
! R+ _& {) [7 u- N
cdatasource ds=new cdatasource(); //数据联结bean实例
3 [: Z1 p+ K3 k9 i+ V, ?# K/ d
java.sql.connection conn=ds.getconnection();
6 v& e+ l' T+ |3 D* H
java.sql.statement stmt=null;
& ? ^* G$ l. p' i' Q& M
java.sql.resultset rs=null;
: H7 B5 Q! y! p2 }) ^% \
cdatacheck dc=new cdatacheck();
^( p: X1 {( Q& I3 R
%>
: [* {, E0 l9 t' X4 w! ]1 D ^
<%
' q6 o0 P! d6 O
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";
) L$ H' F& Q6 q1 O4 ?& h J
stmt=conn.createstatement();
9 `1 z9 ?, x) T% ^2 N) Z8 d6 B
rs=stmt.executequery(sqlu);
0 Y+ X5 e( S$ t3 T& u0 Y
%>
Y7 E1 Q n" X H1 B
<script language='javascript'>
* u% C* w. I R D0 _
arr = new array();
3 V( K0 n3 f' M; s$ f3 Y+ }
<% int temp=0;
3 a$ U' B, l2 ]& Q* K; l
while(rs.next())
. c, N6 ~ i# j" S- W8 T4 H3 l
{
' B5 x; g H X' ^8 F/ G) K/ y7 L
%>
4 t1 j2 {% l; ~# p* E
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
: d6 P D( u. N
<%
. `3 b+ t) N: V9 i! g* P
temp = temp + 1;
/ j+ n8 ^1 O0 l2 A5 z5 G
}
" U# |/ o* {2 p* q9 W* z
%>
/ X2 `/ a% K) S
temp=<%=temp%>;
# u# N: W7 a! }9 F& a, O. X
function changelocation(id){
. @! Y8 C D- E! K6 f
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
# O: A" K# a1 M; o
var i = 0;
4 i) V m7 ~; e; K
document.combo_box.city.options[0]=new option('-------','');
! z1 U8 Z: j* `1 r
for(i=0;i<temp;i++){
8 `! T G v1 v/ X: [, O
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
& |8 z, D8 [0 l) h. ^* X
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
/ S. _( A' X; ~3 h6 t& U: j
}
5 h3 v7 A, L- K \: t
}
: p! c0 l7 m! T
}
: J( @1 L* b% _3 q* _6 f
</script>
1 W5 V$ M' j, W9 \7 H* H
8 M4 d" T4 }$ g `" H5 i# c1 Q# U2 A* e
<form name="combo_box">
: e6 a' @( U6 d& h8 B
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
2 r; l+ d) d# O5 D: S* |4 O: g. X
<tr height="24">
. T8 z% ^+ X% O: ]2 W0 \" h
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
( G4 d2 o, n: @; a2 j6 m g$ D0 q3 p
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
p \/ N0 E3 o3 O7 }+ V
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
# B; L2 L3 ]( k% y' }0 r- k3 V
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
" T8 j- r3 L B1 Z( a. [5 @
</tr>
" F3 h, J/ \& Y7 F2 J
<tr>
6 _# C; }) m6 h; }3 P; C. x
<td>
- U- G* o1 s7 }3 ^; L
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
) `. q! [7 L; ^% i" Y% X; O! p6 Q8 p
<option value="0">请选择部门 ---></option>
0 d+ k" R4 u2 |% T5 W% ~) \8 X
<%
# B5 k( F5 W' F3 N4 K6 N* a1 ]
string sqld="select * from tdept";
, _4 Z; t/ v& D3 ~* H
stmt=conn.createstatement();
& K( q5 y, G3 E d9 U; ]' [
rs=stmt.executequery(sqld);
! X- `1 S! r" k+ ]
while(rs.next())
3 T+ K: S* X6 T: ~( |* U* A
{
. l) o3 T+ _" A9 I1 R$ j
%>
) q: ]1 z+ |, r3 h
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
3 g8 G: n0 ^- s$ L; I& Z
<%
: N2 J; l( F' M" M1 u
}
+ h4 b% {+ u& D
%>
' M% _6 D+ k z# H- r1 `
</select>
" @7 `! d/ j! f" J
</td>
3 g5 b5 W% [5 a, R+ P
<td>
, I6 O: L0 X/ u% t2 L/ U# O3 T& h
<select multiple id=city style="width:150;height:200" class="bgc">
, t; h/ S3 g& c4 }$ ~$ C' j' R
</select>
4 v: \% R- p6 T5 C) r z; j! H9 d! `
</td>
7 i% M" k4 w- P, {5 `. D2 ^. s
<td nowrap align="center" class="bgc">
, @! Y- {0 P6 ?" r: U; N$ o
<input type="button" value="<<" class="buttons">
5 y7 A+ h7 [: H8 B0 i3 T
<input type="button" value=">>" class="buttons">
+ X: K" y2 G }5 p
</td>
0 G# ], d; G9 v, Y% J9 u0 Y& G
<td>
, n& l/ U( J) ]# y3 G
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
: D# K! L7 `6 b4 e: o, `
</select>
& ~) Z3 a. ^0 r5 Q' i, O" M
</td>
' L& w+ N" ~4 i ~
</tr>
/ j/ n4 @& F. U: a
<tr class="bgc">
" g' |0 o$ `2 u# n* y l( ]5 m' v
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
* _% j# X. H8 D# C |
</tr>
! e, s$ h8 |+ S5 F7 j4 G V
</table>
7 ?6 f2 N: S u6 J( \
</form>
2 p. D7 H1 g- G+ r* F$ z
<script language="javascript">
' z1 ]0 b+ c( M
//人名移动
. @- A% r0 l1 f& @( E' r
function move(fbox, tbox) {
6 r3 f8 \1 ^7 v3 U
var arrfbox = new array();
. [" m2 q& H# \
var arrtbox = new array();
# f$ M2 ^3 B" d- c* X. i! D9 {
var arrlookup = new array();
6 d# @% {4 z* R A) ]
var i;
Y8 [( h4 F2 J" }, i. ~& j
for (i = 0; i < tbox.options.length; i++) {
8 p [* V$ c0 ?# K5 j) K9 q
arrlookup[tbox.options
.text] = tbox.options
.value;
* b* w8 l1 H6 [1 U# i$ T7 E
arrtbox
= tbox.options
.text;
3 e- E* c, G0 M0 l( \( e; T
}
' r- L* s% e1 \8 g8 m3 I9 h
var flength = 0;
, j4 h; z) i8 v' w3 f4 F4 G4 U9 z1 t
var tlength = arrtbox.length;
/ Y& I2 S4 L/ B, e/ g
for(i = 0; i < fbox.options.length; i++) {
9 ]. U7 S. @" l+ w w$ ?+ g
arrlookup[fbox.options
.text] = fbox.options
.value;
7 M0 ]. d& w8 ]( J: a( ^& O
if (fbox.options
.selected && fbox.options
.value != "") {
! P% Z/ l7 u7 j8 h
arrtbox[tlength] = fbox.options
.text;
# v6 o( O4 L7 i
tlength++;
- B7 z8 k& ]3 ]4 v( J1 P
}
6 o7 r' ~" i* o" s. y0 I6 W$ J' ?
else {
* O3 H& W( {. \6 M l: Z
arrfbox[flength] = fbox.options
.text;
. n6 ~9 c% o \/ D0 t5 J2 g6 a
flength++;
. M& J& b% c( Y' r' w- D* n/ J
}
8 n0 g) |- _* U6 s
}
" Q1 e! G5 C/ T9 Z) Q1 a0 r8 o
arrfbox.sort();
/ l# \7 n, \$ n
arrtbox.sort();
2 ]. e ]( v$ y2 r
; r% ]! B( {" O- W5 V
fbox.length = 0;
- Z, z. q+ G& k9 I" c) S
tbox.length = 0;
: M& Y' z( O) x
var c;
. U. K: _- O7 ]7 }; a3 c
for(c = 0; c < arrfbox.length; c++) {
' {7 f' j. F0 H' w; M
var no = new option();
" f: k4 m% x' X3 q2 {+ g! g
no.value = arrlookup[arrfbox[c]];
& @5 d: @" n, @7 x# I% m# G. Y9 ~ g
no.text = arrfbox[c];
5 N! \6 ]- a- {; y+ `
fbox[c] = no;
o8 q$ Z% e0 L8 q! j. q2 ^
}
9 o2 B8 h& J% F
for(c = 0; c < arrtbox.length; c++) {
% g' a5 j" c( v( [/ \" [
var no = new option();
7 I. S: j$ h- ?
no.value = arrlookup[arrtbox[c]];
( r; R4 J: {7 @6 R* R" d. j
no.text = arrtbox[c];
/ W) n. s4 w6 |+ g8 u
tbox[c] = no;
1 o8 h$ V1 M3 }1 O
}
. u; m. j) V0 D9 g5 L
}
" r E1 F4 y1 @$ ]/ U U
</script>
: `1 Q- x/ d9 x q* p% q, W
</body>
1 f. S7 H! m9 i' x1 z4 Q5 z
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
