标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
) g* J9 {. z8 N) ~! `: x* G
c pageencoding="gb2312"
5 d. I+ |' j, k. ~7 u$ [
%>
4 Z: p, t, ^# V8 d: y
<style>
8 x: H- A! S! e5 L
.f9{ font-size:9pt; }
1 Y" S8 D+ _9 R; w% i! ~5 r5 I- a
.bgc{ background-color:#aecaf9; color: #0033ff }
# x& Z+ D" M8 F$ g. L
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
5 m1 E9 }% i& O+ R1 ?9 g- Z
border-bottom: solid 1px #4e7dc1;
: B- o+ j( j: g4 j# x6 T
border-left: solid 1px #aecaf9;
1 |8 K6 J6 ^, O: }7 D9 ]7 @
border-right: solid 1px #5679bd;
% t- C( Z' X& m) X; h) y" T
padding:1px;
" S& |# _0 K8 u5 m1 F$ j% l( Z% n
margin:0px;}
7 e9 o2 x% d! x6 `3 ~8 d7 Q- [! ?+ C
</style>
& b+ M. N$ N; D! X/ `6 |/ h8 \
<script language="javascript">
h# I& M& [* \( [9 |7 H6 ]5 }
<!--
8 ~8 K; D: b6 c H
function rv()
! ^) ^, \( M* t
{
0 E6 b( |: H; X$ H$ P+ s7 O
var val="";
# H( u5 I& U& H) g9 v% M' b
for(i=0;i<combo_box.list2.length;i++){
4 i. S4 r$ x, G0 [+ k$ k
val+=","+combo_box.list2
.value;
6 K3 M; e+ T: J& S/ b x4 E1 M
}
# _7 F# \ [; }3 V* l
if(val.charat(0)==","){
0 w- A' b, y! j4 ^0 l
val=val.substr(1,val.length);
) i( V( i, Q3 o* s, f+ M
}
. d3 s+ S" g& ]: p' o% C
opener.form1.frecname.value=val;
! L, R, j3 Y. O" L0 J0 D$ l
self.close();
% }% L1 J* G- B; `. V
}
* b! e7 B, F+ |' B
//-->
9 U; d4 e4 J- i8 Q4 D7 R+ v" N
</script>
' h1 J' Q& E3 V% L/ A Y. [2 Y
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
( G2 i. @7 ]. _; ^# g
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
( W" l& i `1 z# D# k* B
<%
8 o) j: k# }- z# _+ N
cdatasource ds=new cdatasource(); //数据联结bean实例
: I5 }& c2 a9 y$ B" m7 x
java.sql.connection conn=ds.getconnection();
. |3 u' } i8 ~. e4 H
java.sql.statement stmt=null;
# D3 j+ O& Z9 w6 b! z6 a
java.sql.resultset rs=null;
+ j! b$ x9 p3 Y0 J$ ` o
cdatacheck dc=new cdatacheck();
+ i0 W. e c/ O/ h& t5 |
%>
- D' N0 @6 _1 t8 Q9 u$ |* }% l: S+ U
<%
; m4 _/ m* ^% D4 \; ~
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";
* x6 q- ?" @! {2 K; I
stmt=conn.createstatement();
/ S/ [6 {. P3 j g2 ~
rs=stmt.executequery(sqlu);
6 @/ E# A( I- D; {. A! V3 t
%>
& _# W* U' M+ Q/ _% E
<script language='javascript'>
/ s' t1 w2 R0 c- U9 i& d
arr = new array();
, B/ M0 P0 E/ C
<% int temp=0;
$ D2 c3 [' f0 S7 J+ c3 C7 {) K
while(rs.next())
( F2 Z3 @- M; _) v8 P, X' @+ L
{
- u0 p2 ^, V# d( r) g
%>
# Z& u# n. F6 B' P0 m
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
4 K# a; F1 W; |# r' x
<%
+ `# \+ Q6 n: H# c/ Q9 e
temp = temp + 1;
0 p9 s6 L$ j; i9 y- H
}
& C( _3 v" A9 B
%>
2 r8 E. ]+ S* C- p: E8 q5 T
temp=<%=temp%>;
* G' K1 O8 a$ s/ D0 s
function changelocation(id){
- Q# _& D; y: T
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
7 w, ~- f2 r6 y( ^" H3 i0 j$ x
var i = 0;
' N. f8 @ w! n; w+ g6 Z9 C& e! ^* J
document.combo_box.city.options[0]=new option('-------','');
2 }" m* W: t$ |. x( {
for(i=0;i<temp;i++){
& r( G3 R! A$ z* {9 X2 j/ a9 o6 L
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
, Y7 D7 s( [1 m& Z: {- G
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
0 P+ f& ~& O8 C% U7 z
}
6 U0 V' W/ N; f$ m3 ?( j7 Q* f% n6 b$ G
}
" h* C7 h" @) u
}
1 \, j# O2 h1 I2 m! {) u
</script>
3 g0 R$ o+ v$ Z+ x- x$ g
- k* p2 ^0 O* S: O x
<form name="combo_box">
0 s- l! K! |" R
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
7 N7 a) T4 z* V3 q. ?3 N0 k) \
<tr height="24">
4 \4 B" f& {, P
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
7 H; u- Z: L. S. i2 O. u& a
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
8 i. L- l" c" w# e- q9 v
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
; M8 T5 n- S% s
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
0 \0 T' r3 u/ E I$ _+ P2 ]; N7 u
</tr>
6 k3 m: R/ M, r, h1 ]7 A. }
<tr>
4 G4 K" D3 n5 N4 _
<td>
, ~* k# u' y6 F* }3 Z
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
2 p( M0 H0 C3 P* n
<option value="0">请选择部门 ---></option>
. B; Z6 ?" K3 A9 Q1 I
<%
! I( h. G z# F6 N7 f; u
string sqld="select * from tdept";
. g- y$ ~: `# m0 O: r3 M* o
stmt=conn.createstatement();
+ O8 @' F+ S8 B% f2 L, \9 ~2 [
rs=stmt.executequery(sqld);
W* z* s% o1 U: F7 D7 Y
while(rs.next())
/ E2 b- a( C7 o+ T/ n, z$ i
{
- |0 X7 |; Q9 V4 l, `; r4 x$ B
%>
" _. I8 u4 i9 P. Q; U, Y6 E* S9 s
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
2 @+ B8 v" r3 w) \3 w& Y
<%
`. ?4 z: m0 C" ]
}
9 Q: N+ ]% [+ M2 o
%>
; v) ^1 K$ E9 e, B: w4 [
</select>
( u! r$ i: x3 T1 p1 I3 n( ^" I
</td>
0 Q+ t) y; T. C" [9 B
<td>
9 S& e$ G4 [6 N0 r/ |
<select multiple id=city style="width:150;height:200" class="bgc">
% |' u* p2 D! {9 [; G4 k
</select>
. p- D3 l" i# D4 j1 P% O- }
</td>
6 h6 b9 F$ s5 _0 O) f; r" H# W
<td nowrap align="center" class="bgc">
+ t) \- R" K5 Z
<input type="button" value="<<" class="buttons">
( G( u% N$ Z2 e5 m
<input type="button" value=">>" class="buttons">
4 @0 ~: p# ?& H: c$ ]
</td>
r) I0 T! M9 s# S! e2 g2 T* S
<td>
8 h7 q' J: T/ s7 B, U4 e
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
2 |( {3 O" `8 p4 K. a0 R
</select>
; i+ Y$ B6 L/ U
</td>
* Z& g/ l% r/ B- o3 d
</tr>
3 ^4 F7 x1 V+ k1 t
<tr class="bgc">
! u9 M& B) @* V `5 ?3 `
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
" x9 y( }7 a e; h, h$ \8 e
</tr>
/ ^+ N# @: v9 ^+ L% F, P
</table>
% l% \0 U1 U) x! v3 I( V6 i5 {
</form>
0 N* V! Y3 s$ r& q/ ]! ]3 W: W7 ]
<script language="javascript">
+ L) t2 X3 u! ?. s) M
//人名移动
1 Y) Q1 J/ S5 @ p9 Z0 i
function move(fbox, tbox) {
5 y7 F9 h: @% ]5 l. o0 D
var arrfbox = new array();
" i' Y( r) o) w+ F9 g% z
var arrtbox = new array();
2 v0 _! X4 x3 G- C& }: Z; s0 f
var arrlookup = new array();
! ]" G# c; K m" B
var i;
; R3 ]! k* n+ T& {
for (i = 0; i < tbox.options.length; i++) {
. [4 B5 z9 A5 o5 @9 Y
arrlookup[tbox.options
.text] = tbox.options
.value;
# A% @0 O4 u- ]- R5 X
arrtbox
= tbox.options
.text;
$ d' Q& `$ @* {+ d3 p
}
+ o7 ?5 C) o( H9 k5 `2 _, M' j
var flength = 0;
9 B+ h0 N4 |$ C/ p0 J2 A
var tlength = arrtbox.length;
2 ?4 _9 [8 a2 k2 c
for(i = 0; i < fbox.options.length; i++) {
8 K4 v+ u& m$ Q0 ~
arrlookup[fbox.options
.text] = fbox.options
.value;
6 S5 ^2 P$ S% x6 j
if (fbox.options
.selected && fbox.options
.value != "") {
3 s) a* \9 e: m$ i- u6 y B
arrtbox[tlength] = fbox.options
.text;
& N0 w$ d; o, p2 u
tlength++;
- |+ P* S4 M7 A: q6 s
}
: j/ q4 `- o ?: b/ t: g- ~" A
else {
& k$ H& J: X) [' r5 @
arrfbox[flength] = fbox.options
.text;
]. i5 {: D) L" F" o6 B# l# r: W& y* Z' `
flength++;
3 ]5 o* l+ J' K7 V' q! b- C9 _
}
T* m& a, N s6 V
}
; o% Y$ }" Q" _7 l* D. }
arrfbox.sort();
5 e9 u# Q4 Z0 ~. E5 h3 J( l* a( `
arrtbox.sort();
1 |9 P, ~9 H' d7 N* m( [
* t* k: f, I5 p z+ x1 S
fbox.length = 0;
$ T, u# M4 w; ]8 W2 O6 P
tbox.length = 0;
$ R9 S+ U6 u& m2 j2 J
var c;
4 Y) }+ h6 t+ G! S* l+ x/ m
for(c = 0; c < arrfbox.length; c++) {
# V7 U" u" F( l* _
var no = new option();
/ u) ^9 v. V: x) V6 X: B% F8 R
no.value = arrlookup[arrfbox[c]];
) ]' k! ^9 N- Q# M4 w
no.text = arrfbox[c];
# ?9 J8 j5 a$ A: f
fbox[c] = no;
& ]1 X( E4 d6 R: `
}
- ~* l/ A% N! V
for(c = 0; c < arrtbox.length; c++) {
3 ?2 u* |, S" W5 Q% E
var no = new option();
$ n) f: u5 W# R9 S3 h5 X6 m) z
no.value = arrlookup[arrtbox[c]];
2 s B x5 I C! d
no.text = arrtbox[c];
' H. t" y7 D; l. ^# O. R: J! O
tbox[c] = no;
+ \: b* V! W& S" H* J# P
}
, {" G' z3 V- O+ S* D& d% H" A
}
7 E. o" w. s; y% c
</script>
$ b! z. q0 m# B8 `% N( T
</body>
. j- C- r; O @/ {
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
