标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
& P+ T3 @7 E0 Y$ x) P
c pageencoding="gb2312"
4 R: r% @' W3 p7 x
%>
0 C$ F- c6 ?$ q, m3 n, V5 l; t
<style>
) u9 @5 k0 N0 W+ M8 J
.f9{ font-size:9pt; }
7 |# l, \, r c3 X7 ~
.bgc{ background-color:#aecaf9; color: #0033ff }
) u: v2 R# H/ q# T |
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
" z" n: Y8 \$ Q) L1 O
border-bottom: solid 1px #4e7dc1;
1 M& z1 y/ I' h" [
border-left: solid 1px #aecaf9;
' A' L5 l1 Q+ l% L: w0 ?8 H8 D
border-right: solid 1px #5679bd;
5 F* X" ]5 P7 f! ~2 O
padding:1px;
' n5 w2 L s) w; L: t
margin:0px;}
I# i. ^8 r) w3 o
</style>
0 v i! H5 R; P+ R9 o
<script language="javascript">
7 `" D0 T* m' g7 e/ y, b) R3 G& C
<!--
! Z7 T* Z0 z0 ~; z$ @
function rv()
4 O& ]% e3 _: ?+ V X1 p, _
{
2 O N: x4 K9 [ k/ i" h9 G
var val="";
. y3 o3 [' z$ `- F4 P3 B
for(i=0;i<combo_box.list2.length;i++){
% D. |. r2 X* f# f' u5 \0 }
val+=","+combo_box.list2
.value;
e4 Q" }; ]1 v8 [9 S
}
8 p0 h# Q) I! T2 k, E) i6 ~ ]5 ?
if(val.charat(0)==","){
1 ? p8 Z; z) L$ w+ |. _) Y4 l
val=val.substr(1,val.length);
! C/ V* J5 `4 G2 l3 K. Q6 u& _( ^
}
+ x! D I; q+ v# t% V/ W
opener.form1.frecname.value=val;
6 m, t8 c$ H2 l8 e3 B& n- l7 d
self.close();
$ R( R, @: o0 U0 |5 M! e2 k
}
: A9 ?+ d+ i% W* F: p( D$ T, f
//-->
: x3 V& E0 k8 x# g! m
</script>
4 I- S5 N5 u. t; i0 u9 c& F
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
$ I k; X. p2 Y+ m* G- T
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
1 x0 _1 c1 ^% M V) x! @- Z4 v% q3 Z1 ^
<%
; f8 ?) n. _- E. W4 J
cdatasource ds=new cdatasource(); //数据联结bean实例
# x/ P, O+ T2 {% i
java.sql.connection conn=ds.getconnection();
& D7 V. a3 I$ @) e- j
java.sql.statement stmt=null;
1 l9 T/ H# P" {' j, {! j
java.sql.resultset rs=null;
, j4 Z7 }8 X8 z" B; [4 O8 K% M
cdatacheck dc=new cdatacheck();
0 o& K6 H- O# {5 q# g
%>
" c! y+ J0 q* W/ g
<%
4 p8 g9 P7 X& b6 F
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";
5 u: N- K) i) o' o. ]% V
stmt=conn.createstatement();
! {/ H2 k$ s; C
rs=stmt.executequery(sqlu);
8 f% J( G2 X, s& F7 d. n/ U6 h/ X
%>
7 n" C o' ?! A. `3 W: p* c
<script language='javascript'>
( Y8 D+ i+ j/ K8 e2 P
arr = new array();
$ a9 \+ z- ]9 z$ f
<% int temp=0;
3 s5 y C) U8 f! g: L
while(rs.next())
* j* f5 n+ U" O! N8 M/ l0 o
{
0 D" y4 p/ o$ P0 W* W
%>
+ R/ ~5 ]# |6 V( r
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
" z0 W% ?% G0 r ]; g; G. X% ?- \
<%
; j5 t" l; M, i! P
temp = temp + 1;
& N8 M$ t H' R7 P/ S* U
}
' U( j; Z, B7 R8 \2 @0 w
%>
& s# ]% C7 L2 f' H% M! z- F7 b
temp=<%=temp%>;
9 ^2 X0 |6 K( A/ l
function changelocation(id){
% r/ ~+ e8 @5 g2 M
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
& W t4 H" O* r3 t% B$ `; W+ P
var i = 0;
; a! o' u: Z5 a& L+ r
document.combo_box.city.options[0]=new option('-------','');
0 C) t/ }2 [( I+ N- }. P! M9 W! M
for(i=0;i<temp;i++){
& M w6 j. Y% V; I/ i
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
. j/ w. t2 n& } C* u: N
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
e, x* l' d& t3 \8 y j% o
}
5 h6 }9 y) D) C. E
}
. V4 H/ X, r+ F: C/ K+ g
}
; F5 g& A* ?: S
</script>
0 X v% `; O, K4 E* b6 `, \
8 n7 V3 z3 U$ u p* W
<form name="combo_box">
8 R4 K4 L c! i& n8 K5 G. L
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
, q* Z8 ~) |8 N! I( ]
<tr height="24">
6 m' V4 q! o g5 T; H5 p& u
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
" _5 e- ^; }6 l/ f
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
: P4 R8 s R. ~+ V6 c0 C* G* y
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
% V* X: r. \6 j* d3 J8 N7 I2 g
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
1 [9 G/ k7 A3 m! F9 Q
</tr>
' D' g3 D: |, y2 L2 b
<tr>
8 g. p. X( w4 ~4 d, \% e
<td>
" ~/ ?5 Y5 i" V1 v! M$ x
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
8 [. z7 P+ h4 U, {2 U
<option value="0">请选择部门 ---></option>
3 ], ^' F% s: H" |
<%
- l) z: ]% X4 y7 ^4 S4 N
string sqld="select * from tdept";
0 L( }. i( Y3 Z# Q9 j; i+ D4 _9 C
stmt=conn.createstatement();
/ Z( p @; A" x R' d
rs=stmt.executequery(sqld);
& w9 a. @ d) d) j+ S
while(rs.next())
/ H- s- w- {. h( f
{
) \& q, K# b O
%>
( Z- D2 y i) A/ R
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
. Z; x" q6 t& N1 ]! @
<%
! F3 Q7 o/ P0 g \8 @' ^
}
* C7 D8 W+ C3 g* S& s" r4 i+ ^9 c/ I
%>
0 _* z. C9 p+ \% R n4 v' H9 ^, ]
</select>
8 J% ^& j9 A; F# g3 n. d, E
</td>
3 y# { ]3 g) [9 O% z5 m8 n
<td>
& T( i5 Y0 Q( k# `5 Z1 |
<select multiple id=city style="width:150;height:200" class="bgc">
; y8 H6 Q# t* i8 Q
</select>
" e X" X. s# \
</td>
; h/ A( e9 t, N: M3 y0 k
<td nowrap align="center" class="bgc">
0 [! s7 ^9 {0 N# W& d7 c
<input type="button" value="<<" class="buttons">
, U: L* U, b3 v
<input type="button" value=">>" class="buttons">
O: |* M! R1 d: G
</td>
7 L7 Z' @9 k: I3 R( }
<td>
1 \1 S! S( e/ K0 y7 R9 y3 [
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
5 B2 i/ Z" K+ l& K1 V
</select>
* E9 t# {8 L+ y& c4 b
</td>
; e c( v! F9 ~+ l8 a
</tr>
% u+ v5 V! u2 p! l0 a$ a% u5 b
<tr class="bgc">
/ F! c9 U8 s* u; f! U
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
( k* u, X1 C5 W4 R: R: @
</tr>
R( f8 b! }* f, V! K9 z8 n
</table>
8 b$ L* o4 `) w7 k1 p5 d
</form>
5 f0 @' ]! t5 {4 ~2 w
<script language="javascript">
) h7 d1 z2 G5 m9 Y7 {
//人名移动
: x( g T w; S1 u1 k" r; W
function move(fbox, tbox) {
3 a W- H* p7 f" q! N
var arrfbox = new array();
f/ Y8 q9 g Q! n
var arrtbox = new array();
% b8 G4 D* S0 w0 V% I
var arrlookup = new array();
% ~$ K" Y: u2 m
var i;
7 g. w6 X: E5 y2 Z
for (i = 0; i < tbox.options.length; i++) {
8 U! ~, F* C1 D9 F8 {9 T, t
arrlookup[tbox.options
.text] = tbox.options
.value;
2 h6 T+ Z6 j- H1 i/ h) G# ]
arrtbox
= tbox.options
.text;
% i8 r0 l5 O1 G+ q
}
7 G' E6 M& C& K9 N; e4 N
var flength = 0;
- S7 Q' |" x5 y2 ^' G3 y2 J. P
var tlength = arrtbox.length;
) }. o2 N9 U8 n& T/ A" A
for(i = 0; i < fbox.options.length; i++) {
6 s) T. a& N4 D4 x
arrlookup[fbox.options
.text] = fbox.options
.value;
6 k" n8 U: W3 t' c( K
if (fbox.options
.selected && fbox.options
.value != "") {
8 @+ I1 l& T w! q# M) F+ E
arrtbox[tlength] = fbox.options
.text;
0 i# R* w! g3 \) G
tlength++;
& i$ A) u0 M- Z+ L, `
}
( f3 A0 f' J! m/ f( n
else {
( h) a E. D% T+ i+ @
arrfbox[flength] = fbox.options
.text;
2 Z, v2 ?4 G% `; O8 x
flength++;
& u- j) B8 n$ q9 b* [" v' @5 \* g# v
}
+ q" ` G9 x4 l/ V4 w$ s9 Q
}
. P* c: s) ?, @7 u
arrfbox.sort();
& \# |' f2 P1 E1 l! M& m: y
arrtbox.sort();
6 y) B+ g! ` L. m
3 [; Z$ I9 w8 ^, a4 I) Y
fbox.length = 0;
! y# n5 a6 h: U$ y1 c$ ~6 J
tbox.length = 0;
: ^: D) U/ Q `0 f* k0 C5 F; b$ q& O7 ^
var c;
9 s/ Q' n( x1 f
for(c = 0; c < arrfbox.length; c++) {
' u. l; r7 ?' T: T
var no = new option();
) t5 k1 t1 \& u
no.value = arrlookup[arrfbox[c]];
, a" J% ?4 q) B2 g% q! O
no.text = arrfbox[c];
4 z$ f+ [' c. Y
fbox[c] = no;
7 b/ G) A+ Y% i$ ] n
}
! E+ j, C5 S$ d9 H& H
for(c = 0; c < arrtbox.length; c++) {
9 u7 |* N4 B- o
var no = new option();
, C2 E; n1 q6 a$ ^# C
no.value = arrlookup[arrtbox[c]];
9 H- C3 R- g5 \0 I
no.text = arrtbox[c];
# u& q" |1 J4 R8 Z8 c
tbox[c] = no;
' n7 n- ?: C- w
}
# c5 R* s) T$ G9 B; U
}
! D$ [1 K5 R4 W2 }1 }
</script>
: s3 |/ J/ r+ i! N* k j9 S& U/ h
</body>
E' s6 T% }* T* [9 c i7 ]
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
