标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
6 N) y5 b" ^4 `# u
c pageencoding="gb2312"
7 A) f3 K& q( [4 C; R
%>
) q! t: c/ W2 e
<style>
0 z3 i& `1 x9 n$ @, {2 i
.f9{ font-size:9pt; }
4 r* A Y8 l+ ?4 z7 z" j& ^/ S
.bgc{ background-color:#aecaf9; color: #0033ff }
$ Y3 ]/ ]. a$ D- s5 s Q
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
0 O/ h; F, ?* @$ B% o
border-bottom: solid 1px #4e7dc1;
c y# T5 j, m% c- h9 |$ f6 l" W
border-left: solid 1px #aecaf9;
/ H5 J9 f& W& F. W4 e" _* c- T* ]
border-right: solid 1px #5679bd;
% `9 l$ b. u9 V; I7 I7 {* Z6 O
padding:1px;
: f7 Q( A" g' Y5 Z) N
margin:0px;}
, _+ k. D3 X3 ^9 v: Z
</style>
0 J; Y* m' {0 N0 ~' d
<script language="javascript">
$ c, H7 l3 K) H# ?6 f8 ~
<!--
' N1 W" i4 S" r6 n' S2 k ^
function rv()
9 D/ O- h2 |. I6 Z" a$ h
{
# T1 u: J5 h9 {8 I7 n
var val="";
+ \3 t, P9 m" i" W Q
for(i=0;i<combo_box.list2.length;i++){
/ Z4 J* {# F" g8 d
val+=","+combo_box.list2
.value;
& F5 @9 z' K/ M7 t+ m
}
( I D3 B5 d1 e: G, x' B0 L v
if(val.charat(0)==","){
" s$ q0 r5 s. c& C1 v- M
val=val.substr(1,val.length);
: f. y3 l* v4 d6 g8 d6 I3 T( K
}
. [, U6 Y5 Y5 Y: [! j F
opener.form1.frecname.value=val;
9 ^1 D$ l- p+ z+ Y0 {1 C1 Y5 Q, {
self.close();
3 T9 B/ T7 c7 Y' M8 ~) i" O
}
) Z! Q0 T6 u( P
//-->
- Z, O* d6 p- s4 v g5 O, O9 z
</script>
, T' }' k% l5 B/ ?
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
y6 U; E6 z0 [: u. d2 u. n& k
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
& P( h6 H- M( j2 I4 X) C5 O7 c( z0 P7 ?
<%
: ]( Z4 I+ D. X' u i; Y4 J$ v+ j% L
cdatasource ds=new cdatasource(); //数据联结bean实例
( Z }. I& Q @' f1 Y, e; W! L; c
java.sql.connection conn=ds.getconnection();
% M7 R5 F, b0 N+ g& n" g
java.sql.statement stmt=null;
; f, t. m, W) M* w0 T. J+ j7 D3 `
java.sql.resultset rs=null;
5 J) h( n0 Q( ]7 p& K6 s0 Q" O
cdatacheck dc=new cdatacheck();
* n! D9 _; |% m
%>
* O, W; `" y4 M$ z
<%
; [& U. L" k* p5 ~8 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";
$ U( B, x$ K2 w6 N f
stmt=conn.createstatement();
9 e g1 `/ b! s% z: m0 t
rs=stmt.executequery(sqlu);
( x2 k( F7 E( D, s% H2 p0 P
%>
; B. U4 i4 a2 g# L7 i5 F8 ]1 g
<script language='javascript'>
9 C. b7 U9 N' P# q& f0 h
arr = new array();
4 A2 v2 g! V- p8 L* ]% |
<% int temp=0;
' B! @; W; p$ z9 H6 p5 X W [
while(rs.next())
# Z! n" r, `7 j5 D
{
( M+ ?( v( Q. z1 ~) ]9 e% ?8 o+ t
%>
+ f8 S2 o! D, o
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
; x2 b- O2 S) l. N
<%
! d! N- E& F0 \) L3 d
temp = temp + 1;
, N; Z( z# h* O3 }1 D
}
& i6 C# I; u2 F6 H+ y' J, o6 s7 `
%>
4 z4 V4 ~ [: ?) Q
temp=<%=temp%>;
6 y, K5 r. `( b) H0 ]4 V
function changelocation(id){
1 o1 y7 q+ Y* c' d1 I: U2 f, d
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
" L* q( b# E. {) t& B0 n' F) m
var i = 0;
; q3 j. b$ d r% ^
document.combo_box.city.options[0]=new option('-------','');
5 }% m/ H& L- M% N$ v8 S8 F
for(i=0;i<temp;i++){
z' J& I/ `) e0 l9 P
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
3 T( V5 V' _4 }
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
0 y3 K1 x0 X/ u' m% I2 H+ B
}
* ^& d6 G! y$ ~
}
% p: h/ s' G" {& K: j9 a' _' `
}
! z$ e! G' \' v
</script>
; Y. B: k& Z K& @) M
1 c4 n6 T+ \ w7 ]$ Y: f5 H6 `" r
<form name="combo_box">
) h8 E5 u! E6 ~1 n
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
* Q$ C8 F5 I# V4 B) D
<tr height="24">
$ f, O9 i" t; g/ o( r9 U
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
5 h) u0 w" ^: e6 I# C8 K
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
3 r( H1 {# _$ O4 |& k/ Y
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
( {0 B, v9 ~" c2 } w
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
n$ d7 D7 u; X, W* n# s' d
</tr>
9 K6 G! D8 l2 a
<tr>
/ w# e( L$ q* h2 V7 Z% k
<td>
) W3 h/ K7 _6 @
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
. u6 B" T4 e3 ^ }; }7 H
<option value="0">请选择部门 ---></option>
* p7 V1 @$ Z' T5 c
<%
6 k5 ~, ^4 N" c) l6 c
string sqld="select * from tdept";
! b- \( }3 V B! R/ v0 o
stmt=conn.createstatement();
, Y+ s/ F0 W0 A8 E2 {
rs=stmt.executequery(sqld);
% Q) p( a+ s9 s. e
while(rs.next())
* c: N9 Y: N/ H: B; t/ f
{
! N+ {7 v. |$ @% }6 h
%>
6 r; ^* a; I& Z5 R+ B9 b" t+ G- F1 Y' e
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
7 \% @. {3 a9 W e$ J
<%
: s$ S, S3 C5 R6 k$ e" |
}
8 M4 L; I7 S/ ]+ \8 L4 ~
%>
" ~2 n. ~6 |4 f+ y: X' q
</select>
4 y' a; Q t# z$ Z" Y' U X; g
</td>
! }5 G( f$ E1 ?- C+ ?3 B
<td>
( Q' O6 i2 w* \
<select multiple id=city style="width:150;height:200" class="bgc">
! q# i- F+ |. v9 ]; E% f8 U
</select>
& y9 }4 J! B4 [6 }% B
</td>
# h: t! l" V( V f3 M
<td nowrap align="center" class="bgc">
* u, T$ ?( j. S
<input type="button" value="<<" class="buttons">
5 {+ k9 c2 a, ~2 n; E2 r5 I
<input type="button" value=">>" class="buttons">
# m' A5 d, x/ O2 M' [- b
</td>
$ A0 b( E# i, k! N V- V0 U
<td>
- W4 W4 q5 l: ]+ `
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
0 a8 y/ K. v6 W- ]8 d; I8 Y8 A
</select>
7 {/ s& Z2 J3 V2 X+ T1 X" O) U4 Y
</td>
% ]) w6 `+ @& C, s o/ a; _2 ?
</tr>
) o$ }9 M+ h3 }' B% P8 f6 J0 r" ^9 A! @) \# w
<tr class="bgc">
, h5 N" |) `) S8 O! n
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
8 @* k# s# _5 u+ O/ A) o' D+ P
</tr>
( M4 C& r7 W6 E0 a% W/ p
</table>
+ ]8 ^0 ^! j6 p# C, I
</form>
! z$ W- T9 Z4 N z, c2 p- M( A
<script language="javascript">
! h% C6 W1 C& T4 I
//人名移动
2 q% W& Y, a0 B
function move(fbox, tbox) {
- {, U6 w* L6 d! B6 S
var arrfbox = new array();
1 Y+ k" M$ ?2 s
var arrtbox = new array();
" `# `- k3 u4 U) I$ J; P( f3 |9 O: w
var arrlookup = new array();
; R8 E9 h* @* B. v/ w- N; r3 w4 l) f
var i;
8 h& n+ I1 ]3 ^+ i5 ^; H3 E
for (i = 0; i < tbox.options.length; i++) {
/ a8 ]2 b* D4 R+ v0 Q$ n: G# v
arrlookup[tbox.options
.text] = tbox.options
.value;
' x% ~6 F# P! ~1 s/ G$ Z' J8 x. }# ]- p
arrtbox
= tbox.options
.text;
$ K. o9 g% q6 ?( h
}
" o3 [: [7 _: {" s# d ^
var flength = 0;
1 z. m0 c- k1 ]# E# y5 {% N
var tlength = arrtbox.length;
, h& z8 m7 _' _ ~
for(i = 0; i < fbox.options.length; i++) {
4 ~9 \( h# Q9 ]- y P) D/ A& q
arrlookup[fbox.options
.text] = fbox.options
.value;
; Q8 l# j2 c# f0 q' z; w$ b
if (fbox.options
.selected && fbox.options
.value != "") {
: H& W: R" g" D* ]" v4 n
arrtbox[tlength] = fbox.options
.text;
% \. n$ J7 I. `9 D6 @, |; K6 n
tlength++;
7 y9 N8 J" W+ }, |1 d8 l
}
9 y1 l9 H: r0 `; B8 X0 L- W
else {
8 E9 G4 a4 o5 |7 k' E
arrfbox[flength] = fbox.options
.text;
9 A) f/ u5 ?+ @
flength++;
" R, U4 u$ q: H6 |" \
}
: `0 L: C6 P1 G! L% F. `
}
* E. F; l* {- b( l. u+ R+ R
arrfbox.sort();
; m8 i& C3 S; o. @$ k6 a
arrtbox.sort();
$ w% S _5 f4 V) E
3 ~: j3 J6 Q$ x, k$ D
fbox.length = 0;
) T1 ^% z4 t7 r$ v' ^9 T
tbox.length = 0;
! C, \7 v% N4 _; f2 C+ m# [
var c;
( |+ h3 K1 X9 I& B) o
for(c = 0; c < arrfbox.length; c++) {
5 ]2 [" I E6 `& U; e
var no = new option();
; C* x4 G+ e4 N9 `1 c
no.value = arrlookup[arrfbox[c]];
) B9 E* y$ p" x& T& Z# {' \! e0 x& O
no.text = arrfbox[c];
# X" E, W5 M' G6 T8 G- C/ N
fbox[c] = no;
& W/ e! X+ F3 V
}
7 e5 @; b5 [2 u. a; U
for(c = 0; c < arrtbox.length; c++) {
4 Z; c' j& ]' y
var no = new option();
( s. k) N0 e: q9 M$ `6 W9 V
no.value = arrlookup[arrtbox[c]];
0 o! f, q3 A0 m* Q1 v0 F, }
no.text = arrtbox[c];
9 b4 r7 Y" c7 V2 b
tbox[c] = no;
& c( Z0 y+ K' k5 X' n% z
}
( N- q) I% I2 X0 a4 ^1 K
}
5 ?! w& o; Q1 |$ r5 M8 i+ U( L
</script>
3 C: w. _1 X. ^
</body>
9 B; B' o; n" r* O- Z+ ]
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
