标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
* Y+ w6 Z! s) {) u
c pageencoding="gb2312"
, u& h4 B' L0 ^) H
%>
0 c# H; u2 A1 U5 \
<style>
- Y6 G9 A( d# C( |# _
.f9{ font-size:9pt; }
! a& h7 F- i* {* t; x* @
.bgc{ background-color:#aecaf9; color: #0033ff }
! b4 l' @/ L6 A" H# j6 e, @1 T
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
* ]8 i( S$ b; k! n& j. [) n
border-bottom: solid 1px #4e7dc1;
5 }" w2 C( c5 H0 a% j& |
border-left: solid 1px #aecaf9;
6 e: C! S9 h+ {0 h6 o
border-right: solid 1px #5679bd;
) x7 H( A. W r, V( r% u* h+ x& x
padding:1px;
5 i* m+ T% G2 m5 m l$ ^. z
margin:0px;}
9 S0 Q' e# F$ ` v2 ?6 p# c1 Z; ]
</style>
( s- d J F, T8 O/ b# g0 [6 x* o. m
<script language="javascript">
$ N# p$ d8 r$ K; ~' L
<!--
$ o- D7 ]7 x, J, F6 Q4 u
function rv()
! S5 ^5 z, E& O% r- a
{
6 l! P. t0 i; A
var val="";
# c, p; v/ `+ k( X6 X; B% t9 ~
for(i=0;i<combo_box.list2.length;i++){
9 ?( q2 h o' k: `8 X7 \2 [ Q
val+=","+combo_box.list2
.value;
7 K+ e g9 }5 d
}
6 Z) i* @3 x8 T @
if(val.charat(0)==","){
8 E p S1 U/ y( p: d( e
val=val.substr(1,val.length);
* Q4 B( B; l6 P
}
X. b4 K, d" [
opener.form1.frecname.value=val;
- @; b8 T* f" y' f5 D2 k
self.close();
- B8 D5 S2 }% ]/ n
}
1 Z' v8 t0 z- H( D I. c; M) e/ W
//-->
5 Q5 y% L- B2 E5 r; ?
</script>
& [ b( W. u. a, C5 @+ ]
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
$ k1 s+ M- y: a; c. g Y( K
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
: `3 N0 A- U& S
<%
& e7 L9 V) r% ^1 p' I5 i& z! r5 p
cdatasource ds=new cdatasource(); //数据联结bean实例
D: d8 j: X h' r
java.sql.connection conn=ds.getconnection();
2 x* ]0 L. {) R; k+ ]( N! w+ f
java.sql.statement stmt=null;
' Y1 ?7 u# I! Y% n' g
java.sql.resultset rs=null;
. n5 b( s" h' v: r! l
cdatacheck dc=new cdatacheck();
" b* V/ s. d' G# X: G
%>
4 d% g, O, ~; c3 b9 ]+ I/ r
<%
( N5 r4 E& J( |& ]
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";
8 g- d9 m! l8 T8 l" w1 ^, ?
stmt=conn.createstatement();
0 D) y0 g' o$ \: J4 D) Q( \
rs=stmt.executequery(sqlu);
: G! Y9 _' L2 Z# e# G+ \
%>
4 u0 P& ^, F5 A8 e: n* h( A! j& M
<script language='javascript'>
0 j/ a# M/ N, z" p1 Y1 e
arr = new array();
( E, }# Z! Z7 D L; \; K
<% int temp=0;
/ R- X1 E7 O, Z$ y+ ~4 ~+ |% M8 D
while(rs.next())
/ K/ ~% Z G# c3 [. k: K
{
- @8 q" }9 _; I) Z f
%>
* b! ^+ F" A! q" j2 b+ U5 ^& z5 S
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
! n; E% H$ N) @( P3 g* W* ]8 G' U
<%
8 @1 B# s1 V" q
temp = temp + 1;
* M* N0 c6 t# D' a
}
5 M; N+ k" n% v! d& |7 M
%>
) p3 c( p+ t$ A( {3 X" D8 Q7 {
temp=<%=temp%>;
' ?) K, {( a* B! {
function changelocation(id){
, [6 B7 Y& S; T: i2 h4 ?$ ]
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
; v! `7 u- m1 u: k" R9 h
var i = 0;
6 H4 M [9 G/ z' v: X
document.combo_box.city.options[0]=new option('-------','');
) ~: } Z5 @( Y4 z
for(i=0;i<temp;i++){
5 V! v; N$ s, F2 n2 Y4 O1 d
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
$ g; I8 V" A9 O, J6 R! n5 F% b
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
8 r0 t2 |) b5 K2 O8 L' f }- x/ Q& M
}
( j7 C. ~+ A+ g4 [- R( E! M
}
% p/ r$ ]- j# q
}
; H- g8 X, k, w+ O
</script>
& f0 L. X4 a% F$ P% t1 m) s6 k
, i$ g/ P: e! p# w
<form name="combo_box">
. q* T) v7 Y+ K5 ]" c0 \4 |
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
5 w) a' M* t) D" Q
<tr height="24">
! h5 p) k, q# p; F& O
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
! a* M8 B# z3 o9 q( S3 Y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
8 _: R: h9 v) u% j% w: i' x
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
& q" |% n0 v8 k
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
" _- ~0 ]# _% [% T! v
</tr>
7 K# y2 @* t3 ]: L# \* f6 G
<tr>
% g# w# @. n* r2 J$ W" E
<td>
, g4 E, t1 f: Y7 r
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
" I r. O4 q3 l. c- D+ H
<option value="0">请选择部门 ---></option>
" e: E; c+ k6 N- d
<%
t0 a: N+ h- G9 W
string sqld="select * from tdept";
6 a3 p) }! A7 a: n8 ?4 h3 k
stmt=conn.createstatement();
8 Y& X5 ^$ B: V- H/ ~/ X, Z
rs=stmt.executequery(sqld);
& y5 Q$ Y5 N7 T' B9 O0 e) a, A" [) W
while(rs.next())
5 ?. l) v, z N! l* l* ` L2 {
{
Q5 b. `# X5 D: q9 I# v4 b' R8 ]: a
%>
; B% Q* [, C" G2 R
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
" B7 n! [+ G, x1 L
<%
% G( G9 t' _2 i, ^
}
6 T/ V! |- q1 s# Z/ Z
%>
$ p" {2 u& @/ J& t
</select>
( ]% B' c; I2 p8 {1 y4 s8 Z
</td>
9 j& O$ F8 s5 u0 E4 U
<td>
# C0 ]. D$ @/ W' u, x1 N8 B
<select multiple id=city style="width:150;height:200" class="bgc">
3 i$ {' N) S0 P$ L- U4 M
</select>
# D% Y# e0 \# N7 a
</td>
4 k. O* ]' i1 s# X
<td nowrap align="center" class="bgc">
+ j& i" g/ f) c
<input type="button" value="<<" class="buttons">
! E0 A& Z/ T: r5 m
<input type="button" value=">>" class="buttons">
6 H# r. |" k# n. I) b$ t) Z
</td>
# [+ S$ |5 H6 e5 ^; Q* f5 K6 q
<td>
- b& B( b% `4 a* u: F m* D
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
! ^1 G2 T" o( c/ t4 ^( f# ^$ @, T
</select>
1 i( a0 l4 N- l5 {: z
</td>
+ V; S. `+ k: Y9 N
</tr>
! m" e' Q- |6 Z3 X' y }
<tr class="bgc">
+ G( l8 a6 f" k4 a% @: J
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
$ G/ o' Z, W% K V/ s p
</tr>
2 ~. ]: e |3 i
</table>
' _( u. } c3 S v
</form>
9 u" l) E5 A% h' z; [% G8 V; O% Y
<script language="javascript">
0 d! K1 ?( B4 A* ~6 c3 H
//人名移动
. L3 {$ ~* N+ f8 Z' N/ j) x1 H
function move(fbox, tbox) {
/ E4 L7 E' d0 N6 {0 J6 k
var arrfbox = new array();
# k+ W! |4 L, V4 W+ K; d& [3 ?
var arrtbox = new array();
4 y G1 o/ ? K8 J
var arrlookup = new array();
0 k3 x( Q5 \9 I5 ~# G$ j O
var i;
% ?) \' p* O3 {) W
for (i = 0; i < tbox.options.length; i++) {
' q7 v# H4 b9 C- W
arrlookup[tbox.options
.text] = tbox.options
.value;
# @; {6 G! H/ \4 }
arrtbox
= tbox.options
.text;
" l: f. s8 u/ d
}
: J0 j* S9 E# {1 N- k8 o
var flength = 0;
! S1 P: v% k- W
var tlength = arrtbox.length;
G m0 C% z( F7 ?; v# @3 V
for(i = 0; i < fbox.options.length; i++) {
; j+ g$ P# o: P( ?8 m$ t
arrlookup[fbox.options
.text] = fbox.options
.value;
6 t& t* k7 c0 y
if (fbox.options
.selected && fbox.options
.value != "") {
+ o8 j& Z/ p# w
arrtbox[tlength] = fbox.options
.text;
! F. B' R; n0 ^
tlength++;
n$ [1 r& W6 a- b
}
% a8 I/ ^/ T: v
else {
5 @) k! P% g1 H7 D0 N! e
arrfbox[flength] = fbox.options
.text;
( O2 c1 h, _/ s1 q
flength++;
! [0 l7 C) l. G! X, ^# D
}
( n; Q, i* U7 A, s/ T
}
8 n v3 o. s( Q/ o6 x4 g
arrfbox.sort();
4 m- Q) p2 |3 |
arrtbox.sort();
4 e ?8 T* X/ Q
u. f1 a& G# ~0 T
fbox.length = 0;
( e5 t" p; v7 o0 i) ~
tbox.length = 0;
/ f, s E4 ?) P; F
var c;
$ G% X4 q4 i, h0 u; p0 A4 y
for(c = 0; c < arrfbox.length; c++) {
2 n5 Q4 k* U* x
var no = new option();
8 M5 c0 {4 B# _; f
no.value = arrlookup[arrfbox[c]];
" v( S- Z# z# K, B& D$ i3 u/ G5 Y
no.text = arrfbox[c];
~$ S9 a) j& E' d
fbox[c] = no;
& a; `" ]4 T( O7 q" e0 M& A
}
0 ^0 \( c5 u6 ?1 L2 I" g, Y9 L% `
for(c = 0; c < arrtbox.length; c++) {
" t+ e: _: Y# M# c* ^
var no = new option();
, N0 R- E w* U" j# w7 E
no.value = arrlookup[arrtbox[c]];
: M7 O% O* n& n
no.text = arrtbox[c];
$ X. [* y% I+ m5 T- X
tbox[c] = no;
/ s% o0 ^. q( t* F6 \4 N L$ {
}
1 a# H& W8 T8 z2 ?, T
}
) }# T$ r+ P p) q
</script>
7 ?) q1 X, t% E( W4 f% @- c6 D$ E
</body>
+ |+ e: V; G c% V( \
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
