标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
2 T h& p7 A# |0 [' J0 i8 o
c pageencoding="gb2312"
3 `) G5 P) I* \
%>
& P7 A& F5 x+ k; x3 Y) W
<style>
# Y9 t. g9 H& J( h# [. a
.f9{ font-size:9pt; }
9 _2 Q+ h( C P, Z. A0 h
.bgc{ background-color:#aecaf9; color: #0033ff }
" l# P; C0 |9 n' X6 U$ \
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
$ {* o* Q# R. v& P" L% N+ s
border-bottom: solid 1px #4e7dc1;
3 ?: m, P D0 [3 q4 u
border-left: solid 1px #aecaf9;
# Q* G3 i0 F. i, |- L. i- ]
border-right: solid 1px #5679bd;
5 y4 ^1 z4 i2 q; G' ]1 m
padding:1px;
& E2 Z. W) v7 d
margin:0px;}
$ ^# j) C4 U1 A
</style>
) }* _+ [- n* Q. ~* [
<script language="javascript">
6 x3 G! X5 M b/ g! b2 K
<!--
) G1 k" Y" f3 v* U7 p: |8 B( }
function rv()
& U# R9 Y7 C* d. w* y
{
5 f& E8 y( o+ i- T" U& c
var val="";
" Y1 e/ I) c7 {2 Q5 j& [+ V) |! e
for(i=0;i<combo_box.list2.length;i++){
* h; r( j0 Y4 ~$ \; L
val+=","+combo_box.list2
.value;
% v% S6 V3 x+ J& H3 }9 w5 O$ x
}
- N0 {3 a2 D; I) T3 _6 w6 P8 I
if(val.charat(0)==","){
0 K" I% U5 g$ \3 Q
val=val.substr(1,val.length);
$ P: O% j \: d
}
0 Y) P+ F# g3 L
opener.form1.frecname.value=val;
. V9 e5 l/ D$ `5 J/ S* p
self.close();
6 l; J; c* |! P) ~2 l$ w
}
3 _8 s# n4 t8 L% A# Q
//-->
& J/ u# u: S9 B' i4 D/ ^2 N
</script>
" B/ [. N) B, ~2 L2 @
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
& |, V0 d4 p, ~ o* J
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
$ C( z% E& L- O6 }
<%
; L2 d* ^' t8 v& h" _3 G% D7 x
cdatasource ds=new cdatasource(); //数据联结bean实例
1 K: A( Y, Z, U+ O
java.sql.connection conn=ds.getconnection();
* G6 y5 Z8 i9 P$ e
java.sql.statement stmt=null;
" X, p# P. l: v" C. [
java.sql.resultset rs=null;
/ n Y2 N+ D* o$ n
cdatacheck dc=new cdatacheck();
% \2 ^. M. Z! k! V- b
%>
1 L7 ^( F3 H1 d! m3 v
<%
, b [0 ]" z: M. t1 ^# ^
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";
4 ?7 N5 o$ L! P/ g$ Y( G! Y
stmt=conn.createstatement();
7 O5 y" l. y5 @0 d! Y0 b; W
rs=stmt.executequery(sqlu);
3 m, d/ b0 l: H: p
%>
; N5 V! o; _$ H( [% o- O
<script language='javascript'>
) N- \. s: `! M4 k7 v$ B
arr = new array();
; R0 L. L/ ?3 ?6 ^ L2 S4 M
<% int temp=0;
6 u3 Z& V. {2 R u5 F q& D2 ^
while(rs.next())
% G9 q! v4 r# m% Z+ h$ c& d5 w
{
7 F; |) z( y7 m
%>
- ~# c1 t. p" Q& z' R% l8 C
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
1 r% @* ?3 N& c6 y" Y
<%
8 H8 T0 a& X; J( M+ O
temp = temp + 1;
* ~3 K( c$ d0 M* x/ F
}
5 ^* C0 ^' v9 M; @: L: {
%>
! {2 g; M0 ^$ T( d* b! z; Q$ o6 U( l% Y
temp=<%=temp%>;
3 [4 X- }& |5 B/ U
function changelocation(id){
/ o- v4 h* }8 {8 J) A
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
6 @% }, f4 ^# S
var i = 0;
5 V7 s8 t4 |& H1 J1 e. o7 u5 f0 m
document.combo_box.city.options[0]=new option('-------','');
3 P* G. x7 l* p* o( u6 A
for(i=0;i<temp;i++){
# m" l# r1 @& d2 H i) c
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
9 K2 c; ~) H& |3 \/ D
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
( U* r( u; `, ]3 m
}
/ U+ F0 ?" ^7 ?- ~& ]
}
9 c8 D% p$ v. f" x; \) n
}
$ K' h& m& n, i( U+ K
</script>
/ s+ `% Z- a' V/ V
* X5 D ~5 A8 J2 f5 D3 j
<form name="combo_box">
6 a9 J! r" g' @, \: d. c# C
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
& T7 A: x/ V" o3 ^$ [0 \& y
<tr height="24">
* b9 J3 j5 J/ P9 J) r, C" g v" r
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
5 U; u' X x2 k: r
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
3 F1 Q) q5 d/ V; F/ C0 v
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
( P8 G# R* m9 |$ P5 P! c
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
: |8 ?4 C; j8 s- W% `+ C W6 j
</tr>
( V3 H* D: @( F' v0 G- i
<tr>
4 W$ N: k1 s) u) A+ v+ N1 c) r
<td>
; r( |" y3 U! c1 e/ N
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
% G7 q8 j b5 w7 {
<option value="0">请选择部门 ---></option>
, V. I- u5 _8 B; r
<%
( O5 b9 ]- P, _5 q
string sqld="select * from tdept";
$ i m. c* X6 ]
stmt=conn.createstatement();
0 {- v* r" Z0 s. L$ j3 B' y; p( n
rs=stmt.executequery(sqld);
- b' M' D$ V& G. H
while(rs.next())
/ N5 J) M/ `9 `6 m' ]! o
{
# J& S" j- W5 P2 v+ a, T
%>
0 M y7 w. d& w+ G: k+ U
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
3 u/ A, m9 P0 A [, z5 h
<%
4 P( `2 A$ ~/ O0 U
}
+ ]9 F1 l5 {5 [ b& [% m, s
%>
3 k- o8 B% |$ ^9 @
</select>
, s) |* d# f' i# q
</td>
' n4 L0 W/ k7 |, j2 t. V& W
<td>
' d5 B% g. n; \# R1 e4 Y( j& p5 U& F
<select multiple id=city style="width:150;height:200" class="bgc">
! l2 e- F4 r& d) H7 b4 p( J
</select>
. L- M) l5 W1 A2 D1 k3 ?
</td>
$ _' G0 l* H: P3 [, @$ I
<td nowrap align="center" class="bgc">
4 \% g) [+ V& q8 w9 `6 B
<input type="button" value="<<" class="buttons">
8 S8 b% F; R9 [3 V
<input type="button" value=">>" class="buttons">
! N1 [ p& B/ I: `: U% o" j
</td>
1 e; D1 E' l+ g7 J) \0 ?+ P
<td>
4 O! N$ C; j7 O9 N: i2 w0 ^6 {
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
; E" o1 H; _0 Z1 G9 B0 r8 V
</select>
& B7 O B6 ]/ H. ]4 n
</td>
+ q+ T! i3 ~4 N! J/ H2 ]
</tr>
) g2 j- a6 T0 Q: `
<tr class="bgc">
2 g% ]5 k, I! B/ K; g
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
+ C% c- o$ h r) k
</tr>
2 o) H/ W" M& w3 C$ f% J4 |
</table>
& n1 c/ s- |7 P; ~8 W
</form>
, w$ |! O- l! l* i) O3 P7 M) m
<script language="javascript">
. q0 q6 Z) B* G" t: n& r" j# j
//人名移动
: d* c! n8 O8 O) J/ s. W, a' y
function move(fbox, tbox) {
+ u5 M7 l5 F7 k1 d2 z; G
var arrfbox = new array();
, e Q) G! J, c( P- e' l' }
var arrtbox = new array();
8 X8 M, B7 E. B3 _$ Q+ _& n
var arrlookup = new array();
7 U0 a4 s. W6 b7 j5 E0 a$ K/ q
var i;
' P4 ?+ U6 I- w, {- m. A6 c
for (i = 0; i < tbox.options.length; i++) {
3 f% i& D3 i" G# U8 x' H- u( Z$ T
arrlookup[tbox.options
.text] = tbox.options
.value;
9 B# Y4 ~4 l. q7 Y5 A5 b3 V
arrtbox
= tbox.options
.text;
7 \2 O- f- A& _! j/ s+ t; V
}
) Y) c5 }) b. U
var flength = 0;
5 A" L9 W5 L! H7 t5 |0 d
var tlength = arrtbox.length;
' r( v) x g P" V& F0 F+ c
for(i = 0; i < fbox.options.length; i++) {
5 Z2 T$ P) o- L K' }' Z' R, g
arrlookup[fbox.options
.text] = fbox.options
.value;
; _6 ^- I" ~ g1 B$ g/ F, h2 k1 E; J
if (fbox.options
.selected && fbox.options
.value != "") {
( X5 h+ Q& A: r
arrtbox[tlength] = fbox.options
.text;
# q" y6 `' Z' [8 a& W- @
tlength++;
* O( O# y, s4 R) P
}
I* Y5 W9 k( v8 O+ E
else {
: _9 R$ r+ F# Z
arrfbox[flength] = fbox.options
.text;
3 C. \. o: J* k0 b( b" P- n
flength++;
& x( T6 \2 [0 Y" r) j1 w. F8 n( O- @
}
2 k+ }" S! ]) w5 c8 {: B
}
- ?2 B! L# Y9 D6 i
arrfbox.sort();
# i# a, }; J b9 R# M& }) P
arrtbox.sort();
5 V/ J: q) g8 z8 U8 a% f6 B
1 ?* v7 q7 l9 f' a' x. }4 h
fbox.length = 0;
- ?- U6 j* V9 U$ E% A9 K
tbox.length = 0;
1 P4 X6 w+ q: a: f7 w( l( ]6 }
var c;
) G* S2 z- u: Z1 @
for(c = 0; c < arrfbox.length; c++) {
# e6 D$ B" m [2 p
var no = new option();
. b; H. d8 ?& B h9 C
no.value = arrlookup[arrfbox[c]];
2 v0 u5 W7 v u1 L) c7 }
no.text = arrfbox[c];
) c) r" U, D9 P* Y1 K* {8 ]' }/ r
fbox[c] = no;
! x3 y. Q8 L1 S1 v5 @; C* V
}
' o& e" C+ R7 O3 ]
for(c = 0; c < arrtbox.length; c++) {
( [' H6 ?# t V1 M; X) P, Y7 _
var no = new option();
" d% w- Y8 _! m
no.value = arrlookup[arrtbox[c]];
; I. M" q: p+ w1 r
no.text = arrtbox[c];
5 w- R2 |+ x, \* r" W
tbox[c] = no;
/ f: _- l0 r8 z# T, ? u/ p7 k
}
! b+ s8 b0 V% N$ m- W0 {' v3 n
}
2 i$ V6 R( C' j' l* r2 I2 M, z
</script>
) ?- z$ E: M5 s4 I+ t8 d
</body>
& J# l5 _: n8 v& @ j+ i
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
