标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
4 g+ `1 a; z6 d' h X6 _% ?0 F& D$ R
c pageencoding="gb2312"
. Z ~% k/ K( m% Z) ~" f' ]+ Y% @
%>
1 `. P' n3 Z+ x5 R
<style>
5 I5 _) F* E2 u4 t) K0 C- i- z
.f9{ font-size:9pt; }
5 c$ K1 ~: Z. k# g, I7 O6 W# |
.bgc{ background-color:#aecaf9; color: #0033ff }
: {, x( L, b1 b+ j a
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
. k$ E# y2 V9 B/ z R/ P
border-bottom: solid 1px #4e7dc1;
/ `# w. n0 P9 k# T$ a8 H) |6 l. \5 x
border-left: solid 1px #aecaf9;
# M" j+ R* z9 x+ J+ |
border-right: solid 1px #5679bd;
" b' r& x6 D' o6 h& B
padding:1px;
5 v% R" _, D' L2 J
margin:0px;}
! @" c0 Y5 a* W% l
</style>
+ v% C2 D( a. \ `3 ^( ?) }
<script language="javascript">
) ]0 T# M2 ?4 ]# w
<!--
; I5 @4 L0 s% B; q- n
function rv()
5 L( u. }( V- T7 s( Y
{
$ [: ~+ T9 Y" `! k% u: K! e
var val="";
6 w5 [. y- N3 i) O
for(i=0;i<combo_box.list2.length;i++){
3 {9 P+ W7 N3 n
val+=","+combo_box.list2
.value;
6 Q3 Y/ i! F' V+ Z8 A" J; f( q& P
}
7 `7 v) j3 G. h7 S8 \% d! k. H6 o: m
if(val.charat(0)==","){
& m/ E/ M1 C7 U% `, ] m3 L
val=val.substr(1,val.length);
& H* o, x4 x/ m
}
1 w& r6 l8 y p
opener.form1.frecname.value=val;
# m- y. o4 L$ r z# v
self.close();
$ P( k; N* i. D F {/ y1 P
}
7 z# b, ~3 F, L8 k( J9 p% a
//-->
0 `0 T8 y$ y* A/ d
</script>
8 N" b! A5 A4 a6 A6 v! A- t% O& L
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
& x1 p# `8 q: `. ]
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
w6 E$ G- J0 y* U' Y& L* G8 x# y3 P
<%
* Y9 y9 ?& d0 O1 s H; S% [! R
cdatasource ds=new cdatasource(); //数据联结bean实例
3 i, t( D0 A' Q9 H' R- y, @8 h* k
java.sql.connection conn=ds.getconnection();
; ~! p3 ` I- P4 c8 z
java.sql.statement stmt=null;
$ |; e+ P3 c+ @/ c# q% ~6 U: D
java.sql.resultset rs=null;
{, b1 C4 B8 n" c
cdatacheck dc=new cdatacheck();
6 P% t3 K% N, B/ D2 _9 a" _
%>
! R# M* s0 c4 [) B
<%
' v7 H' a* d2 s5 X
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";
2 \. b' M$ s( B& I8 ~1 B& D( z: B
stmt=conn.createstatement();
3 Z9 @7 {' D m
rs=stmt.executequery(sqlu);
- [* k; E, [% j8 l& f* W- ]
%>
U" M6 y3 n# Q, K) \' l" i
<script language='javascript'>
* J: l3 I7 |: _* \- P# b
arr = new array();
! {& O2 V. |# T' x8 B
<% int temp=0;
- M D5 X9 Z: v: t
while(rs.next())
% K) c$ f$ E/ U. F! G
{
! r, s: r v- m; d
%>
) `2 j/ o$ f I; s
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
8 l5 e+ g" q# _* [/ o9 h0 k1 n" x
<%
% H" f6 R3 ?' | Y1 a* f8 h
temp = temp + 1;
l! |( u, M7 p& ~- J3 F
}
! T2 q+ y3 j& N" Z; I; X6 g. B1 l
%>
" t- j1 Y) O2 G# \. Q; T
temp=<%=temp%>;
) ]7 K8 V8 @. `/ w
function changelocation(id){
( [4 P; E J/ b- S' ]
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
+ g, K- u7 |' }" [- w
var i = 0;
' [( y+ p$ w( H2 e8 G& E* s
document.combo_box.city.options[0]=new option('-------','');
( a# h: D7 l4 y$ \! {; [9 q/ E
for(i=0;i<temp;i++){
5 i7 j; T! W# D" v6 p/ H
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
) k! t) U O, U E& i
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
7 w; p1 J/ E$ z+ i" \; c* o" ~+ X
}
! X7 O5 j& p) q! e0 `6 e
}
' M* S0 b# P/ M) J" [- m7 A
}
- }. \; C, e: A T! \) G6 f! J% g
</script>
& E% ~1 F% c8 ^1 X
" r+ M1 Y$ Q0 G$ A
<form name="combo_box">
+ Z8 N3 k0 o" B/ m% q
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
9 Y$ Z$ a& C3 w- e Y
<tr height="24">
; S( ^# x+ ~# v# X5 j
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
+ `+ P2 l: c( x
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
" F0 u s+ l& C- e j
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
& `, h$ L c0 C0 u, n, d: z
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
7 m* L( L. p7 H1 K% I6 o2 T
</tr>
8 E- ^6 |: U" u$ d; h9 r
<tr>
8 I! H( l$ Y7 O5 T
<td>
0 z2 b; h- I \' M
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
$ v7 K! U0 P5 u
<option value="0">请选择部门 ---></option>
$ U$ f' t- F: H, e1 _9 y- o
<%
R, Y1 Z% R1 y7 K
string sqld="select * from tdept";
3 W( V# k; i9 ~5 g
stmt=conn.createstatement();
' ]- b# a ^- A8 _/ Z# m- v) v
rs=stmt.executequery(sqld);
* h) P/ w/ G# }" K, L0 A
while(rs.next())
9 R/ @: U. K; a
{
( m. k3 a4 o. I1 n1 j7 r- @! [ x K
%>
0 w; ^6 M3 T$ B- j
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
! b( t2 e4 W/ N/ M" H5 i
<%
( T$ [! R6 t0 v; Z
}
0 U3 w5 Q9 \* K& R3 W* ^3 b
%>
8 `) J8 x$ O( i" b* \
</select>
c: x" B! N8 S
</td>
3 x7 n2 s* m, z$ R: t
<td>
& \" X# K( e* c& ]- m# d& _
<select multiple id=city style="width:150;height:200" class="bgc">
1 ?% v6 {6 F) |: Z1 r3 a+ l
</select>
, z) L$ }* z6 ~: Q( m/ J
</td>
% @; z6 f' ]+ B! f/ w) G6 I, V
<td nowrap align="center" class="bgc">
9 `. V- v, p% H1 ?9 Q/ z
<input type="button" value="<<" class="buttons">
3 ~* V4 I- k( E8 n' ^
<input type="button" value=">>" class="buttons">
- i+ }5 b0 b& u! T# \$ n2 L5 a
</td>
1 l. o/ n) u- Z% D
<td>
4 f( p( v- e G, f2 a( K8 n. @
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
- o) @% }& K$ o. W/ r5 Q X! j6 d
</select>
w! }! W2 t8 o' ]/ A6 C
</td>
- Z) s" b+ k- U" r: l' Y$ I
</tr>
( ]3 R" F3 ~1 Q* Q# `& y
<tr class="bgc">
- `9 ~' u& N" ~/ L
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
$ r. [6 M+ \' \# D- m2 K, [/ m7 `
</tr>
' v; o# Z$ H/ K& M% {' S/ f
</table>
k7 I" _# K9 @" [# w/ W' w4 u9 z
</form>
0 J/ f! B9 y$ V; K& E
<script language="javascript">
6 K L. W/ K+ b0 P$ o! B" T" d, V
//人名移动
3 Q- s# ^" s% r L& a- \# ~+ V
function move(fbox, tbox) {
9 m5 M0 N/ e5 O8 ~4 _$ u; R
var arrfbox = new array();
$ D% [3 L S$ X% @! ~0 _
var arrtbox = new array();
) X9 Y2 M" {& X- Y% Y2 N: r
var arrlookup = new array();
; a" B/ c7 v! K% o N \: {
var i;
$ i: x. a4 m# d0 R& D
for (i = 0; i < tbox.options.length; i++) {
: K8 W3 U) i K+ Z
arrlookup[tbox.options
.text] = tbox.options
.value;
7 Q$ H& R( I( |# [, {4 `
arrtbox
= tbox.options
.text;
( i+ M/ @+ X5 K, [+ H! k; N
}
4 @* M1 A/ j$ y$ y( q# @# Z
var flength = 0;
- f7 \7 t2 b; r: I
var tlength = arrtbox.length;
! z* `3 O+ d7 v3 R( D
for(i = 0; i < fbox.options.length; i++) {
+ L5 ^. O4 k K8 w! k
arrlookup[fbox.options
.text] = fbox.options
.value;
( _- |3 `6 p) w
if (fbox.options
.selected && fbox.options
.value != "") {
+ q; p3 w, I2 v: r4 u
arrtbox[tlength] = fbox.options
.text;
$ D+ }/ }" v, W3 |
tlength++;
* U0 X) y5 r! v) C) J
}
* S. w) [; _# e7 n C* A( u' k+ E
else {
2 x7 ^0 M' I* y1 [
arrfbox[flength] = fbox.options
.text;
1 t! s( u$ A0 Q4 B& e; R9 j8 f
flength++;
* X2 ]7 ?3 ]4 t- X& H
}
! f9 h5 m* c/ {( o( i Y7 s/ B! r
}
& p" M: y( o6 K9 \3 p1 N* L" z
arrfbox.sort();
; F7 R& C5 E7 r: X' m
arrtbox.sort();
* q( R( x3 H1 a4 B3 J8 o
4 @0 p, s' ^$ y/ W; Z! h
fbox.length = 0;
7 f. t* X8 {; O
tbox.length = 0;
( n* E, o+ z# F/ c' d) ?
var c;
% Z! B; y+ R7 a: R
for(c = 0; c < arrfbox.length; c++) {
9 u; h A) w+ c0 _: i
var no = new option();
( R' j* I2 ^( Z1 N5 X' M
no.value = arrlookup[arrfbox[c]];
B* t2 Q" e0 P& g! m
no.text = arrfbox[c];
0 w" m% z4 S, |' ~, C" |
fbox[c] = no;
% J7 A1 _& b0 O. t: t+ R5 z
}
# v( d% z9 H% a# B" F1 z1 F
for(c = 0; c < arrtbox.length; c++) {
9 S/ W, |5 W6 ?, C8 O" P
var no = new option();
' l) ?6 H& J% A6 _7 m6 G1 s
no.value = arrlookup[arrtbox[c]];
8 Q8 N* A& d* |, P2 d+ O- @6 g& U
no.text = arrtbox[c];
4 L, [: [0 l" ^# u5 X& f
tbox[c] = no;
) S h8 d0 C3 {1 ^2 \8 Z" L
}
6 ]% d$ w# o5 A$ u
}
: f2 {9 B1 E6 e3 L0 H
</script>
6 Z3 d5 c6 U4 V l$ D, O5 e
</body>
7 ^% d* z0 E; F" p( ?
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
