标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
* b; ], a( U; c/ t
c pageencoding="gb2312"
( E2 t/ B8 S/ @( x& `8 e0 z# A! a
%>
; N$ Z% H4 y, r
<style>
+ |+ a2 L8 j+ z$ [7 ?' X
.f9{ font-size:9pt; }
1 w+ [& M: `& r$ k
.bgc{ background-color:#aecaf9; color: #0033ff }
+ | B" z g1 Q7 ~/ B
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
8 S. L, @0 j: p6 Q9 k' f, _3 _
border-bottom: solid 1px #4e7dc1;
# ~6 l; \& @ Y# z( P6 C
border-left: solid 1px #aecaf9;
" D2 r8 M- E7 l+ U
border-right: solid 1px #5679bd;
0 D9 ~7 b/ d3 P b6 C
padding:1px;
7 \2 f) z: Q, J l1 Q# \2 |
margin:0px;}
, Z# M1 H( P3 m m- Q
</style>
2 ]# P) ?5 z" O2 s7 w" \" m
<script language="javascript">
7 r4 \5 ?, ]: a, a# q- ^8 `. V
<!--
! N/ s; {& N: p* R5 H' ^: o3 h
function rv()
Z& D( E9 N9 Q0 f8 [; z1 x
{
9 M- i' g7 \$ D# H3 k
var val="";
# N. e# q% p' W& a8 u
for(i=0;i<combo_box.list2.length;i++){
' ?7 N; `: S7 [6 D$ k
val+=","+combo_box.list2
.value;
/ q/ W6 a2 g$ q" h( `" I( C. z' c
}
7 s: i, `) b; c( ^; g6 ~
if(val.charat(0)==","){
1 e- X2 w6 Q' w9 `6 R! V
val=val.substr(1,val.length);
" _& P( m3 z- n) C+ _+ J# t
}
~ Z5 E& F( L" W) u# a8 L, U
opener.form1.frecname.value=val;
) r4 F; ~& m+ ?; |# T5 \
self.close();
: ] _% C1 `2 S1 w- i3 A
}
) ]9 \% p2 [ v) Y0 {
//-->
3 u3 o5 G& z/ i( w0 j8 n- D
</script>
' m c ]* K- O4 Y8 z
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
$ O2 X( [- I, F0 ?7 K4 v) i
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
' J1 L' Y2 g" P2 `
<%
3 W- N2 i2 D ]8 E% s- c2 Z" |2 w
cdatasource ds=new cdatasource(); //数据联结bean实例
' B$ n; q4 G& [
java.sql.connection conn=ds.getconnection();
- A* ~2 s' Z! p9 P! n+ z! Z& c
java.sql.statement stmt=null;
5 z1 B) K( ^( s! f3 G+ A, D
java.sql.resultset rs=null;
/ E5 y7 E5 U6 h- M5 {
cdatacheck dc=new cdatacheck();
: X, E, `( m8 S: G2 \8 h! G4 s
%>
/ |0 d# u( [9 z2 Q
<%
* Q D% D q( ]. m
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";
9 K4 L) j( A1 n2 D9 e
stmt=conn.createstatement();
& k% Z% o- ]; o9 M; S- M6 T
rs=stmt.executequery(sqlu);
% g3 N( s7 _+ q# M9 x
%>
) C1 E o B. a
<script language='javascript'>
. z! |3 b/ r+ O9 O% z8 Z
arr = new array();
& J0 m0 M; e( ~* E+ \1 K2 F' E) h3 ~8 z
<% int temp=0;
3 I$ o( x% B5 \. G6 I4 J+ f# I! F; L
while(rs.next())
$ m% x Z$ W1 h2 w
{
$ m, j1 y6 B/ Q: O5 M* T
%>
( Q# l* R5 B( r8 g# `# W! v. G
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
3 D0 `6 Z' d; |% x' ^" Q- b
<%
2 o- @. B# J: Q& r
temp = temp + 1;
; Q# z; v, @/ T% L) E& x
}
( J+ o3 P3 A' D' s' s+ B* X
%>
P2 _/ ]3 N% P; e1 ~ d* F) U) G
temp=<%=temp%>;
0 P1 ]) {6 V* O+ y2 q7 @3 h! [# J
function changelocation(id){
; ~6 J- [7 U7 v6 ?# T6 X
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
! ]4 F4 w4 S" C
var i = 0;
\) ^+ ~% V9 a' I( A1 O
document.combo_box.city.options[0]=new option('-------','');
/ }0 q4 a$ g6 F' Q, r
for(i=0;i<temp;i++){
$ _* [$ x4 G# K. {
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
) q( v8 {9 H# s2 `9 H7 K
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
, |" u0 {% O4 i. y! c% V
}
, q, t6 L& X! f0 J+ @: M, A) R/ z
}
% l1 O$ ]$ Q3 s- p. n- k4 u$ R
}
. A# N( o$ R+ Q4 m& |
</script>
6 b9 F) ~! f8 \, L) ~
! M, D+ g" v4 ~, i# j+ @
<form name="combo_box">
: o* |3 P' L; a3 K5 M! n- M
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
, v( b" n0 G: I( y
<tr height="24">
& L7 J1 S( f* O
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
& u, j( j0 f" D/ P) U
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
# s# f, t7 C9 N2 e7 }
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
" I5 u6 Z' d7 ]" Q" n, m1 E! M& u- B0 w
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
# t) s2 A I8 [4 N" k/ p
</tr>
; I9 H$ L" V' K: U- C& j( _! B
<tr>
k/ ~: H: v$ [0 _* S! P N: D' _
<td>
1 u6 w" D3 _* B% w. I
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
. g6 R: |, [3 d# D
<option value="0">请选择部门 ---></option>
- P# B& x/ V% I* ]$ O2 s
<%
; Q8 t6 E# t8 f+ i9 ^
string sqld="select * from tdept";
; @ I, g4 f- o! L! U' H
stmt=conn.createstatement();
4 w! F ?% [! i
rs=stmt.executequery(sqld);
8 T6 C! X* L" w* a7 N
while(rs.next())
/ S7 N) w; Y7 u3 k& ?
{
% A8 \6 v) X' p, g6 G
%>
0 O! N! Q- ]$ d; r
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
( H3 l' [; `7 M! S+ Z6 ~ v7 J m
<%
1 ?% V# {& O+ a: Q: e- Q
}
: r' O+ C% O+ z& F1 B# j
%>
4 H2 {$ r) ~6 Q2 D# L' C+ \) }
</select>
+ N+ o8 @( E# y5 o( {4 |* X; V
</td>
/ [1 S5 ?# Z* c9 r m
<td>
4 |$ G* O' W; Z; g; o0 Z
<select multiple id=city style="width:150;height:200" class="bgc">
$ y& E l" l, c( o1 b0 l; V
</select>
( E$ ^; h( ]) D9 A8 s6 x8 p) a6 S
</td>
! \* N ?3 w- |7 r: }2 Q
<td nowrap align="center" class="bgc">
( C! |3 k4 @/ P! M( B! d
<input type="button" value="<<" class="buttons">
" X4 a0 C, y" w. X/ F
<input type="button" value=">>" class="buttons">
X- }: W1 X4 p+ u. j
</td>
0 B. m( P1 H1 z; f! p! C
<td>
3 p' i2 I$ Y$ u
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
% \( T9 ~$ ?. E
</select>
- d2 [) m# v; J2 _+ p; X3 b" z
</td>
) v! i! z8 ?7 H% M/ p. k
</tr>
. N$ R/ o/ B& ~ @0 v* n1 ?3 G
<tr class="bgc">
8 j3 A. d% S! Y! q
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
4 k8 n8 X; ^$ ]2 M
</tr>
' M% Z8 }4 l/ a) [4 G2 Z
</table>
' q% w% S7 p* A5 l! O7 u
</form>
: f# x4 L( ^$ w3 Y
<script language="javascript">
6 W$ i8 N9 u) n6 A$ L1 R
//人名移动
& Y$ }% {0 x; a5 k6 j
function move(fbox, tbox) {
m' }1 S! j2 O
var arrfbox = new array();
8 m: L3 F% C. r; O K* |# V
var arrtbox = new array();
% C# T. x* o2 Z
var arrlookup = new array();
. u& t- d3 n, B3 f# ~$ {
var i;
8 d% e8 t& z+ d9 z% a% ^
for (i = 0; i < tbox.options.length; i++) {
# Q6 L; V- ]# ?3 j; g- x" q+ o
arrlookup[tbox.options
.text] = tbox.options
.value;
1 F" Y: v6 |. B% u/ Y6 E" p: s V
arrtbox
= tbox.options
.text;
) Q( D! w) S" q- Z; y
}
# }, F. e3 [. ?7 f( K" h/ w
var flength = 0;
# O: D1 o* q+ \% U8 k. V5 D& m0 s2 A
var tlength = arrtbox.length;
0 w/ u* z7 e9 g" ?6 D
for(i = 0; i < fbox.options.length; i++) {
d- `: y9 U5 h- s
arrlookup[fbox.options
.text] = fbox.options
.value;
) F' }* j' s. H' p% D- g* P- I, B
if (fbox.options
.selected && fbox.options
.value != "") {
. M, c- q( A4 ?. |1 N( r+ g, ]# A
arrtbox[tlength] = fbox.options
.text;
) p( V/ u$ b1 t6 g) Z- X
tlength++;
' J, N& m3 R1 R
}
* k) `( S( [6 B+ C; v( o
else {
9 R1 ~# I' `9 [9 X6 ~
arrfbox[flength] = fbox.options
.text;
5 x* k K( g9 l3 S' ^4 |4 W
flength++;
# k; X$ i" W' p6 n6 K0 Y$ ]8 a/ b/ V
}
$ V4 U2 r- R( p J0 `
}
9 x$ r. E( P' |9 f" P
arrfbox.sort();
/ J9 `! p. E% r4 T: o1 K d
arrtbox.sort();
5 F8 H' _; A' [+ B/ X1 B
( X% M( ~) {% B; i: c3 Z+ e
fbox.length = 0;
, S# ?0 {0 F+ x# i( ]
tbox.length = 0;
1 w' l, j5 o$ l5 p7 e8 N
var c;
. G+ T! ]3 ^- D* l5 J0 w5 ?; y; }
for(c = 0; c < arrfbox.length; c++) {
* I Y- @5 c! f1 W5 y1 D- p6 m
var no = new option();
8 b6 {0 P3 f$ o4 Q; s. S" J
no.value = arrlookup[arrfbox[c]];
/ {$ F, Y t+ O3 I2 u+ M# j5 [' O, Q
no.text = arrfbox[c];
& s5 s$ t3 |( }
fbox[c] = no;
; r- c& H! j# @; \
}
) r" M0 N+ b- ]# T$ f. p2 r( `
for(c = 0; c < arrtbox.length; c++) {
* e0 D1 b- p+ `/ R" v5 a8 e) n
var no = new option();
$ E: {# G% S- u6 F& G
no.value = arrlookup[arrtbox[c]];
0 G F5 ~' f4 z# @# P w6 P& v1 W
no.text = arrtbox[c];
* Y! @) ~( Z7 ~$ S+ T! l* h! c' W
tbox[c] = no;
7 ]# g/ M) Y0 d: N2 ^ {- Y3 D- a
}
, b( S9 w* D2 i
}
7 \" f; _/ S, d8 d
</script>
6 w% R2 a! t- d
</body>
0 z2 K2 m: T6 n4 @2 v1 T
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
